Использование селекторов ngxs в компонентах - PullRequest
Новая
       6

Использование селекторов ngxs в компонентах

1 голос
/ 05 марта 2020

Я использую ngxs с Angular, и сейчас, когда я пытаюсь получить изменения из магазина, я определяю селектор в состоянии 

@Selector()
static getData(state : DataStateModel){
    return state.data;
}

, а в компоненте я использую декоратор @Select чтобы получить наблюдаемую 

@Select(DataState.getData) data$;

Проблема, с которой я столкнулся, заключается в том, что если мне понадобится получить доступ к этим данным в компоненте, я подпишусь на данные $ observable и сохраню данные в новой переменной в компоненте. . 

ngOnInit() {
    this.datasubscription = this.data$.subscribe( data => {this.componentVar = data});
}

Для этого необходимо отписаться вручную. Это правильный способ реализовать это? Есть ли встроенные функции или сторонние плагины, которые могут помочь очистить эту часть? Я также пытался. 

store.snapshot()

1 Ответ

0 голосов
/ 11 марта 2020

Если вы не хотите управлять подпиской в ​​коде компонента, вы можете использовать Observable из декоратора Select для создания новой цепочки Observable, например, в этом примере dataChanged$. В этом, наблюдаемом через оператор rxjs tap, вы можете запустить некоторую проверку или переключить переменную et c, как вы описали в комментариях. 

@Select(DataState.getData) data$;

dataChanged$: Observable<any>;

ngOnInit() { 

 this.dataChanged$ = this.data$.pipe(
    tap(result => // do something)
 );
}

Затем в вашем шаблоне подпишитесь на $dataChanged через async канал.

Другой вариант, конечно, вручную отписаться, когда для этого компонента вызывается ngOnDestroy.

...