Ich entwickle gerade eine Anwendung mit Angular mit Redux-Prinzip mit ngrx.Rufen Sie Komponentenlogik, wenn sich der Zustand in ngrx ändert
Ich bin auf der Suche nach einer Best Practice für die Reaktion auf Zustandsänderungen und rufen Sie einige Komponentenlogik abhängig von diesem Zustand. Ich gebe Ihnen ein (vereinfachtes) Beispiel deutlich zu machen, was ich meine:
reducers.ts
import {createSelector} from 'reselect';
export const getViewTypeOrFilterChanged = createSelector(isLoading, getActiveViewType, getActiveFilter, (isLoading, activeViewType, activeFilter) => {
// ensure that data is loaded
if (!isLoading) {
return {
activeViewType: activeViewType,
activeFilter: activeFilter
};
}
});
Beispiel-component.ts
@Component({ ... })
export class ExampleComponent implements OnInit {
// properties ...
constructor(private store: Store<fromRoot.AppState>) {
}
ngOnInit() {
this.subscriptions.push(
this.store.select(fromRoot.getViewTypeOrFilterChanged).subscribe((result) => {
if (result) {
this.property1 = result.activeType;
this.dependentHelperClass.method1(result.activeFilter);
this.method1();
this.method2(result.activeFilter);
this.method3();
}
})
);
}
ngOnDestroy() {
this.subscriptions.forEach((subscription: Subscription) => {
subscription.unsubscribe();
});
}
// methods ...
}
Wie Sie können siehe Ich verwende auch reselct, um drei verschiedene Status-Slices in einem Selektor zu kombinieren (getViewTypeOrFilterChanged). In der Subskription zu diesem Selektor möchte ich dann einige Aktionen entsprechend dem kombinierten Zustand durchführen.
Die Sache ist, ich fühle mich wie ngrx Store und Abonnements mehr in einer Art von Publish/Subscribe-Muster hier und es fühlt sich nicht ganz richtig an. Auch die Subskriptionen (ich habe mehrere) in ngOnInit und Abmeldungen in ngOnDestroy stören mich, aber ich kann mir keinen Weg vorstellen, wie ich z. asynchrone Leitung Gibt es vielleicht eine elegantere Art, auf (kombinierte) Zustandsänderungen zu reagieren?
Danke!