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

【问题标题】：How to call a function from another function in Angular?如何从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 中的闭包以了解它发生的原因。希望你能找到所有的答案:)

标签： angular typescript ionic-framework ionic2 ionic3

【解决方案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 没有在全局范围内声明，而是在类内。