Observable中的更改不反映在视图中

我基本上遵循this guide来实现Observable数据服务。Observable中的更改不反映在视图中

在商店类（ItemsStore），我有我的BehaviorSubject持有该项目的列表

items:BehaviorSubject<List<Item>> = new BehaviorSubject(List([]));

的组件使用该存储在模板如下：

<ion-slide *ngFor="let item of itemStore.items | async" > 
    [...] 
</ion-slide>

现在这当应用程序加载时工作正常 - 我的所有项目都显示。不过，如果我使用下面的代码在店里类添加项目到BehaviorSubject：

this.items.next(this.item.getValue().push(newItem));

这没有反映在视图中。我的印象是，变更处理由angular2自动完成，但似乎并非如此。

如何检测并处理这些更改，以便它们反映在视图中？

来源

2016-09-26 Rico Leuthold

items属性应该是可观察的，但您将其设置为BehaviourSubject类型。在你的链接有：

@Injectable() 
export class TodoStore { 
    private _todos: BehaviorSubject<List<Todo>> = new BehaviorSubject(List([])); 

    public todos: Observable<List<Todo>> = this._todos.asObservable(); 

    constructor(private todoBackendService: TodoBackendService) { 
     this.loadInitialData(); 
    } 
    ... 
}

所以假设你遵循本教程中，你应该做这样的事情：

private _items: BehaviorSubject<List<Item>> = new BehaviorSubject(List([])); 
public items: Observable<List<Item>> = this._items.asObservable();

来源

2016-09-26 12:52:24

你绝对是对的，完全错过了。虽然我不明白为什么当'BehaviourSubject'出现'Observable'时为了调用'.asObservable（）'。不幸的是它仍然不起作用。 –

我怀疑问题出在你的方式拨打电话：

this.items.next(this.item.getValue().push(newItem));

我不知道什么this.item.getValue()返回，但如果push()方法是相同的Array.push()它返回新的长度（重要的是它不会返回附带新条目的）。

的async管被定义为：

异步管订阅了可观察到的或无极并返回它已发出最新的值。

因此，当您拨打this.items.next(...)时，异步管道只收到新长度并尝试用*ngFor进行迭代。

如果this.item持有<List<Item>>，那么你可能想打电话：

this.item.getValue().push(newItem); 
this.items.next(this.item);

顺便说一句，该asObservable()方法用来隐藏你与Subject工作的事实。主题让我们打电话next()或complete()这是你不希望其他用户搞砸的东西。出于这个原因，最好只是通过Observable，并且只为自己保留Subject，只要你知道你需要它。

来源

2016-09-27 09:49:38 martin

解决了它 - 这是一个非常愚蠢的错误 - 对我感到羞耻。ItemsStore被注入到两个不同的类中，并且由于依赖注入为每次注入创建了一个实例 - 那么，我们有两个应该只有一个的实例。

将依赖项（ItemsStore）移至全局提供者数组解决了问题。

来源

2016-09-27 17:43:44

Observable中的更改不反映在视图中

回答

相关问题