angular - ngrx ofType, @ngrx/effects

Încerc să înțeleg cum funcționează efectele typeof în interiorul ngrx, dacă declar în modulul meu de aplicație:

....

@NgModule({
    imports: [
        EffectsModule.forRoot([TodosEffectsService])
],

....

și eu scriu cu siguranță fișierul efect:

@Effect() createTodos$ = this.actions$
.ofType(CREATE_TASK)
    .map(() => {
        console.log('called');
            return { type: 'OTHER'};
});

@Effect() addTodos$ = this.actions$
.ofType(CREATE_TASK)
    .map(() => {
        console.log('called');
            return { type: 'OTHER'};
});

Încerc să înțeleg, acum, în timpul execuției, dau dispatch unei acțiuni, acest this.action$este abonat și de fiecare dată se execută ofType pentru a se potrivi tipul? Sau ofType se execută o singură dată!?

dacă este apelat o singură dată, când trimit acțiunea, cum știu efectele de fiecare dată la care efect să se aboneze/execute?

mulțumesc tuturor!

Răspuns #1

Pe scurt, când .ofType() este apelat, acesta se abonează la fluxul sursă de acțiuni și trimite acțiunile corespunzătoare către fluxul rezultat. Deci este într-adevăr apelat o singură dată.

Dacă ne uităm la codul sursă, vom vedea că, în esență, ofType folosește operatorul filter din librăria rxjs, ceea ce înseamnă că this.action$.ofType(CREATE_TASK) poate fi extins la

this.action$.filter(action => action.type === CREATE_TASK)

Descrierea modului în care funcționează filter poate fi găsită în documentația rxjs:

Similar cu binecunoscutul Array.prototype.filter, acest operator preia valori din Observable-ul sursă, le trece printr-o funcție predicate și emite doar acele valori care au returnat true.

Merită menționat că fiecare dintre efectele tale preia un observable (this.action$) ca intrare și returnează un nou observable care este abonat o singură dată, atunci când efectele sunt inițializate. Observable-ul returnat definește modul în care acțiunile din observable-ul de intrare sunt transformate, dar nu afectează observable-ul sursă în sine.

În exemplul tău, metoda ofType() returnează un nou observable care „ascultă” observable-ul this.action$ și emite doar acțiunile care îndeplinesc condiția action.type === CREATE_TASK. Apoi urmează operatorul map, care de asemenea returnează un nou observable care „ascultă” observable-ul returnat de apelul ofType() și transformă fiecare acțiune primită într-o valoare nouă conform unei funcții de proiecție pe care o furnizezi. Dar toate aceste observabile sunt create doar o singură dată, la inițializare, iar când trimiți acțiuni, acestea doar „curg” prin observabile, sunt filtrate și transformate.

De asemenea, poate doriți să vă familiarizați mai mult cu rxjs. Aș recomanda să vizionați prezentarea „Veți învăța RxJS” susținută de André Staltz; ar trebui să vă ofere o intuiție despre ce sunt observabilele și cum funcționează.