ngrx: как совместить наблюдаемые для использования в асинхронной трубе

Question

Я пытаюсь иметь теневую копию в ожидании изменения с помощью наблюдаемых и ngrx, и я бег в маленькую проблему, я не понимаю:

export class SearchBoxContainerComponent { 
    filterSettings$: Observable<FilterSettings>; 
    filterChanges: {[key:string]: any}; 
    filterChanges$: Subject<{[key:string]: any}>; 
    constructor(private store: Store<fromRoot.State>) { 
     this.filterChanges = {}; 
     this.filterChanges$ = new Subject(); 
     this.filterSettings$ = Observable.combineLatest(
      store.let(fromRoot.getFilterSettings), 
      this.filterChanges$, 
      (filterSettings, filterChanges) => { 
       return Object.assign({}, filterSettings, filterChanges); 
      } 
     ); 
     this.filterChanges$.subscribe(foo => { 
      console.log('filterChanges$: ', foo); 
     }); 
     this.filterSettings$.subscribe(foo => { 
      console.log('filterSettings$: ', foo); 
     }); 
     this.filterChanges$.next(this.filterChanges); 
    } 

    updateSetting(key, value) { 
     this.filterChanges = Object.assign({}, this.filterChanges, {[key]: value}); 
     this.filterChanges$.next(this.filterChanges); 
    } 

    submitSearchbox() { 
     // TODO send ngrx action to really update the filterSettings 
    } 
} 

Здесь я использую Observable.combineLatest вместо непосредственного использования

this.filterSettings$ = store.let(fromRoot.getFilterSettings); 

получить наблюдаемую от ngrx магазина.

Проблема, которая возникает у меня, заключается в том, что при первом открытии окна поиска все равно null. Только после обновления значения все заселяется. Если я напрямую свяжу его с store.let, он работает.

Я использую асинхронной трубку в моем HTML, как этот

<my-component [filterSettings]="filterSettings$ | async"></my-component> 

Но в * ngIf так только получить оценку после открытия SearchBox. Мое предположение, что асинхронная трубка подписывается после того, как все действие произошло, и без новых событий оно не получает значения. Но почему это работает с store.let? Это, что различное наблюдение, которое всегда дает вам ценность?

Вопрос в том, что я делаю неправильно, у меня создается впечатление, что у меня все еще не хватает чего-то ... бонусный вопрос: Это хороший способ сделать теневые копии данных, которые могут быть прерваны или отправлены?

Answer 1

Использовать rxjs/BehaviorSubject вместо простой rxjs/Subject. Он будет передавать последний элемент новым подписчикам.

this.filterChanges = {}; 
this.filterChanges$ = new BehaviorSubject(this.filterChanges); 

Вам не нужно next() после, так как он принимает значение по конструктору. Observable.combineLatest() должен работать как ожидалось к тому времени.