Question

我有一个产品服务，其方法是从json数据返回一个Observable。

product.service.ts ....

getProducts(): Observable<IProductData[]> {
    return this._http.get(this._productUrl)
        .map((response: Response) => <IProductData[]> response.json())
        .catch(this.handleError);
}

在我的组件中，我订阅了serivce并调用getProducts（）方法返回Observable IProductData []。

mycomponent.ts ..

productData: IProductData[];

ngOnInit(): void {

    this._productService.getProductsObservable()
        .subscribe(
                productData => this.productData = <IProductData[]>productData,
                error =>  this.errorMessage = <any>error,
                function() { console.log(this.productData ) }
        );
}

当我查看 onCompleted console.log this.productData 未定义时！

我想使用此数据来设置组件中的字段。何时/如何确定数据已被返回？

如果我在按钮点击事件中输出 this.productData ，则表示已填充数据，但我想在init上执行此操作。

非常感谢任何建议或意见。

欢呼声

Answer 1

您没有在最后一个区块中使用箭头功能，因此this是您传入的complete函数的本地。

除了出现外，() => {}和function() {}

之间存在实际的语义差异

请在此处阅读：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

...在箭头函数之前，每个新函数都定义了自己的这个值（构造函数中的新对象，严格模式函数调用中未定义，如果函数被称为“对象方法”，则为上下文对象），等等。）。事实证明，这是一种面向对象的编程风格。

在ECMAScript 3/5中，通过将此值中的值分配给可以关闭的变量来解决此问题。

箭头函数不会创建自己的上下文;相反，它捕获了封闭上下文的这个值......

Rx订阅OnComplete会触发，但无法使用数据

1 个答案: