Observable changes not reflected in view

Question

I mainly followed this guide to implement the Observable data service.

In the store class ( ItemsStore), I have mine BehaviorSubjectthat contains a list of items

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

The component uses this storage in the template as follows:

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

Now it works great when loading the application - all my elements are displayed. However, if I add the item to BehaviorSubject, using the following code in the store class:

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

This is not reflected in the view. I got the impression that change processing is done automatically with angular2, but that doesn't seem to be the case.

How do I detect and process such changes so that they are reflected in the view?

Answer 1

, , :

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

, this.item.getValue(), push() Array.push(), ( this.items ).

async :

Observable Promise , .

, this.items.next(...), *ngFor.

this.item <List<Item>>, , , :

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

Btw, asObservable() , , Subject. Subject next() complete(), . Observable Subject , , .

Answer 2

items Observable, 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();

Answer 3

Decided this - and it was a very stupid mistake - ashamed of me. ItemsStorereceives injections in two different classes, and since Injection Dependency creates an instance for each injection - well, then we have two identical types, where there should be only one.

Moving dependencies ( ItemsStore) to a global provider group solved the problem.