Question

我在理解观察者/订阅者模型并循环返回时遇到了一些问题。

所以我有一个鸡尾酒组件可以抓住一系列鸡尾酒对象。

cocktail.service.ts 的核心：

constructor(private _http: Http) {

}
// Returns an array of cocktail objects, using .map to json them
getCocktails() {
    return this._http.get(this._geturl)
        .map(res => res.json());
}

cocktail.component.ts 的相关位：

// Calls the cocktail service and gets the json array
constructor(private _cocktailService: CocktailService) {
    this.cocktails = _cocktailService.getCocktails();
}

现在我明白我可以使用：

循环cocktails

<li *ngFor="let cocktail of cocktails | async">

但我只想通过在观察者身上使用订阅方法来了解我将如何做到这一点：

constructor(private _cocktailService: CocktailService) {
    this.cocktails = _cocktailService.getCocktails().subscribe(
        res => this.cocktails = res
    );
}

现在我无法使用异步管道，就像订阅我一样，但如果我使用：

<li *ngFor="let cocktail of cocktails">

我刚收到错误。我如何订阅，并循环返回？

我得到的错误是：

core.umd.js：3004 EXCEPTION：app / cocktail.template.html：3：5出错造成：找不到不同的支持对象＆＃39; [object Object]＆＃39;的键入＆＃39; object＆＃39;。 NgFor仅支持绑定到Iterables，例如阵列。

Answer 1

如果您B，则Qt3DExtras::Qt3DWindow与“{1}}不兼容，因为无法订阅。” 如果您使用例如.subscribe()，则可以使用Subscription来|async

.map()

Answer 2

为您的json结果集创建一个接口，并将其映射到服务中，如下所示。

return this.http.get(dataUrl) 
.map(response => response.json() as ICocktail[]);

并在组件中创建一个该接口的类型，并使用它来映射服务的响应，如下面的代码。

cocktails: ICocktail[];

 this.cocktails = _cocktailService.getCocktails().subscribe(
        res => this.cocktails = res
    );

希望这有帮助！

迭代订阅者

2 个答案: