web-dev-qa-db-ja.com

angular 2ルーターのみを使用する場合と比較したngrxルーターストアプロジェクトの目的の理解

私はrouter-store ngrxプロジェクトを参照しています(- https://github.com/ngrx/router-store )。

このプロジェクトの使用方法がわかりません...

たとえば、プロジェクトのドキュメントから次のサンプルを見てみましょう。

store.dispatch(go(['/path', { routeParam: 1 }], { query: 'string' }));

これはangular 2ルーター:router.navigate(['/path...

...または特定の状況でのみngrxルーターストアを使用する必要がありますか? (もしそうならどれ?)

また、angular 2 router html link e.g. <a routerLink="/heroes"クリックされますか?

より一般的には、プレーンangular 2ルーターを使用する場合と比較して、ngrxルーターストアプロジェクトによって達成されることを誰かが説明できますか?

言い換えると、ngrx router-storeは、angular 2ルーターに加えて何をもたらしますか?

Edit:ngrxに関する興味深い情報とサンプルのソースは、もちろんngrx example-app(- https://github.com/ ngrx/example-app )。

そこにルーターストアへの依存関係が見つかりましたが、アプリ内でルーターストアが使用されている場所を見つけることができませんでした...

参考までに、ルータストアに関するサンプルアプリにあるコメントを次に示します。

@ ngrx/router-storeは、ストア内のルーターの状態を最新の状態に保ち、ストアをルーターの状態の単一の真実のソースとして使用します。

45
balteo

@ngrx/router-store が存在するため、ストアがアプリケーションのルーティング状態に対して 単一の真実のソース になる可能性があります。

これがないと、ストアに表示されないアプリケーションの状態(現在のルート)が存在します。つまり、ストアにルートを表す状態がなく、ルートの変更を表すアクションがないため、 DevTools を使用したタイムトラベルデバッグは不可能です。

router-storeはAngularルーターを置き換えません。ルーティングアクションとルーター自体のリスナーを接続するだけです。

go action creator を使用してルーティングアクションを発行すると、"[Router] Go"指定されたパスを含むアクションは、router-storeその後、対応するルーターメソッドを呼び出します。 router-store-ルータから-ルートが変更されたことを聞くと、"[Router] Update Location"ルート変更を表すアクション。そのアクションは、ストア内のルーターの状態を更新します。

goアクションクリエーターを使用する代わりに、routerLinkを使用してルート変更を行う場合、router-storeは変更を聞き、"[Router] Update Location"ストアのルーター状態が更新されたことを確認するアクション。

そのため、アクションまたは従来のリンクによってルートが変更されても、ストアには常にルーターの状態が含まれます。

とともに "[Router] Update Location"ルートの変更を表すアクションは、DevToolsを介して上記のルートの変更を取り消すことができます。これは、ルーターの状態がストアで表されなかった場合には不可能です。

Redux DevToolsを使用したことがない場合は、チェックアウトすることをお勧めします。

68
cartant