2016-08-25 17 views
6

状態管理にAngular2とngrx/storeとngrx/effectsを使用しています。ngrx/effectsでアクションをディスパッチしないときに無限ループに陥る

特定のアクションは、私は、エラーメッセージを表示したいが、私が@Effects()ブロックでこのタスクを実行することができないようですが失敗します。

@Effect() selectOfficeFail$ = this.actions$ 
    .ofType(SelectOfficeActions.LOAD_FAIL) 
    .do(() => { 
    alert('Error! No offices found!'); // I keep entering here 
    }); 

上記のコードを実行すると、アラートはブラウザがクラッシュするまで無限に実行されます。 @Effect()に帰っているようですが、新しいdispatch()を返すのですが、なぜ分かりませんか?そしてなぜ上の警告()が無限の回数実行されるのですか?

編集:私はSelectOfficeActions.LOAD_FAIL複数回派遣ないです。一度だけ

答えて

4

をgithubの図書館から本exampleよう

何か問題がdoアクションがあなたの効果を通って流れることができ、アクションはその後、店によって、再び、派遣されていることです。あなたが起きてからそれを防ぐためにfilterを使用することができます。

@Effect() selectOfficeFail$ = this.actions$ 
    .ofType(SelectOfficeActions.LOAD_FAIL) 
    .do(() => { 
    alert('Error! No offices found!'); // I keep entering here 
    }) 
    .filter(() => false); 
0

はいあなたは正しい@effectは、新しいアクションを派遣する必要がありますが、私はあなたのアプリケーションロジックで何か問題があると思います。

あなたは、コンポーネントまたはサービスではなく@Effectを呼び出し、順番に影響が基準に基づいてLOAD_COMPLETEまたはLOAD_FAILをディスパッチLOADアクションでSelectOfficeActions.LOAD_FAILアクションを派遣すべきではありません。

@Effect() login$ = this.updates$ 
     // Listen for the 'LOGIN' action 
     .whenAction('LOGIN') 
     // Map the payload into JSON to use as the request body 
     .map(update => JSON.stringify(update.action.payload)) 
     .switchMap(payload => this.http.post('/auth', payload) 
     // If successful, dispatch success action with result 
     .map(res => ({ type: 'LOGIN_SUCCESS', payload: res.json() })) 
     // If request fails, dispatch failed action 
     .catch(() => Observable.of({ type: 'LOGIN_FAILED' })); 
    ); 
9

[UPDATE] 今それを行うための最善の方法は、このようdispatchオプションを使用することです:

@Effect({dispatch: false}) selectOfficeFail$ = this.actions$ 
    .ofType(SelectOfficeActions.LOAD_FAIL) 
    .do(() => { 
     alert('Error! No offices found!'); // I keep entering here 
    }); 

のそれは、「このアクションに反応する意味しますしかし別のものを送ってはいけません "。

+0

ベストソリューションがあります。 –

関連する問題