如何从Angular中的另一个函数调用一个函数？

Posted 2023-03-13

【中文标题】如何从Angular中的另一个函数调用一个函数？

【英文标题】：How to call a function from another function in Angular?

【发布时间】：2019-02-17 22:47:28

【问题描述】：

从输入类型（来自Home.html）中选择文件时调用onFileSelected(event)，一切正常，除非我尝试调用this.callproducts(data,0,c_altcode)。

下面是我的home.ts 代码，我哪里出错了？

 onFileSelected(event)
  
    var file = event.target.files[0];
        ...// some code here
    oReq.onload = function(e) 
        ...// some code here

if(oReq.status === 200)
           
            if(final_arr[0].hasOwnProperty("Altcode"))
            
              var c_altcode =final_arr[0].hasOwnProperty("Altcode");

         // error coming in below line when i am trying to call this function which is outside `onFileSelected` function. 
          this.callproducts(data,0,c_altcode);           
                

          
        

        oReq.send(null);
  


callproducts(a,b,c,d)
...//some code here

当我试图调用onFileSelected 函数之外的这个函数时出现错误。错误是：

[ts] 类型“XMLHttpRequest”上不存在属性“callproducts”

【问题讨论】：

尝试设置oReq.onload = (e) => 而不是function。函数创建自己的范围，其中this 不指向您的组件

您列出了 home.ts，但错误是期望 callProducts 存在于 XMLHttpRequest 中。首先，停止使用 var。使用 let 或 const。其次，也许尝试更好地理解 JS 中的作用域。

尝试像这样写 onFileSelected：onFileSelected = (event) => ..... 除了@MaksymShevchenko 所说的

@MaksymShevchenko 按照您的指导工作，我也想知道如何在全局范围内调用函数，请您指导我，非常感谢您的帮助，我会接受如果您愿意，可以作为答案

@user2828442 这取决于您的home.ts 的组织方式。但对于全局函数，最好使用export function fnName() // code here... 。但请注意，它无法获取类/组件的上下文，因为它有自己的 this 指向自身。我建议阅读更多关于 javascript 中的闭包以了解它发生的原因。希望你能找到所有的答案:)

【参考方案1】：

您不能在另一个函数中调用 this.callproducts(data,0,c_altcode)，因为它不在您的 component's 范围内。

不过你可以试试下面的。

export class HomePage 

  constructor() 

 onFileSelected(event) 

    let file = event.target.files[0];

    oReq.onload = function(e) 

        if(oReq.status === 200)  

            if(final_arr[0].hasOwnProperty("Altcode")) 

              let c_altcode =final_arr[0].hasOwnProperty("Altcode");
              HomePage.callproducts(data,0,c_altcode);           
            
          
        
        oReq.send(null);
  

static callproducts(a,b,c,d)

  

【参考方案2】：

如果我是正确的，“this”等于“oReq”。我不相信“这个”。是对的。试试不带这个的 callProducts。

【讨论】：

它不起作用，只是因为 callProducts 没有在全局范围内声明，而是在类内。