2017-03-20 11 views
1

ui-router 1.0.0-beta.3、1.5を使用しています。これまでのところ、ui-routerは素晴らしいです!Ui-router状態変更:コントローラとスコープを保持しますがDOMを破棄します

私はルート状態を持っていますが、これまでのいくつかの子状態を持っていましたが、兄弟(同じルート親の子孫)の切り替えによって、移行する状態が完全に再現されます。

私のアプリでは、ユーザーがいくつかのボタンを切り替えたり、日付などを入力したり、別の状態に切り替えたり、何かをしたり、元に戻ったりする可能性があるため、なくなっている。また、実際にはいくつかの州がかなり大きくなったり、DOMをたくさん作成したりする可能性があるので、DOMを「非アクティブ」状態で破棄することができるようにしたいと思います一部の州では

私は、ui-router-extrasのスティッキーステート機能がまさにこれだと理解しています!そして、$ state.includes関数を使用して、一部のコンポーネントでDOMを破棄したいときにターゲットにすることができます。しかし、ui-router-extrasはui-router 1.0.0-beta.3では動作しないようです。作者は新しいui-router用のポートを作成しましたが、リリースはtypescriptであり、コンパイル方法はわかりません。参照:https://github.com/ui-router/sticky-states/issues/4

おそらく、私は粘着状態を使用しない解決策が必要でしょうか?私は、サービスを使用してスコープ値をキャッシュすることを考えていましたが、実際にその影響に対する他のSOの答えを読みました。これは、コンポーネントごとに、キャッシュするスコープの値などを処理する必要があることを意味します。これは間違いなく可能ですが、誰かがui-routerに関する他の技術や知識を持っているかどうか疑問に思っています。私が何をしたのかを達成するために:移行されたコントローラー/スコープの移行の変更。

答えて

2

から(喜びでした、非常によく書かれたコード)著者のtypescriptですソースコードを読んだ後:

https://github.com/ui-router/sticky-states/blob/master/src/stickyStates.ts

私は互換性があるでしょうJavaScriptで自分のサービス、に移行することを決定しましたui.router 1.0.0-beta.3を使用します。ところで、1.0.0-beta.3 ui.routerで公開されています。

https://unpkg.com/[email protected]/release/angular-ui-router.js

私のアプローチでした:1.0.0-beta.3はのonCreate遷移フックを持っていないように見えるので、私は希望$ transitions.create関数自体をデコレートしてください。これを行うために、私はたくさんのヘルパー関数とステッキー状態のコア機能を装飾に注入する必要がありました。だから私はStickyStatesUtilプロバイダを私のためにこれを行うようにした。

移行は、(1)StickyStatesUtilプロバイダを作成するsticky-states-utilと呼ばれるモジュールと、状態/状態名が非アクティブであるかどうかをチェックするための便利なサービスと、inactiveEventこれは値に設定されていると、$ rootScopeがアプリ内の何かが消費する非アクティブ状態名のjsonマップをブロードキャストします。設定されていない場合、それはスキップされます。そして(2)、$を注入し、それを使って$ transitionサービスを新しい "create"関数で飾るためのアングルアプリの実際のconfigブロック。

カップルの他の人が私と同じ場所にあるので、私はgithubの上で、このコードを利用可能に:

https://github.com/dsills22/sticky-states-ui-router-1-js

+0

その一緒に入れてくれてありがとう、それは同じに巻き込またちのもののスーパー便利です場所。 deepRedirectがどのようにサポートされているかを確認したかったのです。 親階層ではなくドット表記を使用して、状態階層を指定できますか?また、ここで説明するように、ブール値ではなくオブジェクトをdeepRedirectに渡すことはできますか? – jfoo

関連する問題