2016-12-08 5 views
1

私は現在、私のアプリケーションに状態階層を持っています。角度UIルータ - 子供の切り替え時に親状態の再実行を防止する

- module_base 
    - page_base 
     - tab_one 
     - tab_two 
     - tab_three 

page_base状態が抽象であり、ページ(例えばGET /products/123)のレコードを返し、それは、子タブにアクセス可能なコントローラを有しています。

私が抱えている問題は、コントローラの上にあるpage_base状態のタブの間をいつでも再実行することです。つまり、すべての移行時に製品リソースが取得されるということです。

タブ間をナビゲートするメニューは<a/>のリストで、ui-sref(例:<a ui-sref=".tab_one">Tab One</a>)です。 ui-sref-optsを使用してreloadnotifyのパラメータを調べましたが、違いはありません。

page_baseの状態は、ページ/products/3/*の場合に一度だけロードされますが、ページproducts/9/*の場合は再実行されるようにするにはどうすればよいですか。

また、最初に開いたときには一度だけロードすることはできますが、再読み込みすると再読み込みできませんか?

多くの感謝!

状態構成;

// Page Base 
.state('module_base.page_base', { 
    abstract: true, 
    url: '/{id:int}', 
    views: { 
     base: { 
      templateUrl: 'path/to/baseTemplate.html', 
      controller: 'BaseController', // Reruns whenever the child states are loaded 
      controllerAs: 'baseVm' 
     }, 
     'sidebar': { 
      // Configuration for the app sidebar 
     } 
    }, 
    resolve: { 
     // ACL permissions check 
    } 
}) 


// Tab one 
.state('module_base.page_base.tab_one', { 
    url: '/tab-one', 
    views: { 
     'page': { 
      templateUrl: 'path/to/template.html', 
      controller: 'TabOneController', 
      controllerAs: 'vm' 
     } 
    } 
}) 

// Tab two 
.state('module_base.page_base.tab_two', { 
    url: '/tab-two', 
    views: { 
     'page': { 
      templateUrl: 'path/to/template.html', 
      controller: 'TabTwoController', 
      controllerAs: 'vm' 
     } 
    } 
}) 
+0

私はPlunkerを作成し、主な質問に焦点を当てることをお勧めします。 –

答えて

1

この原因は、実際には状態階層の上位にあることが判明しました。各状態遷移の間に、ACL許可チェックが行われていましたが、この処理中に$rootScope変数がチェック中にfalseに設定され、解決された時点でtrueに更新されました。メインのアプリケーションコンテナにはng-if="$root.userIsAuthorised"があり、DOMからアプリ全体が削除されてから再び追加されました。これにより、すべてのルーティングが再実行され、コントローラが再び実行されました。

要するに、DOMからの削除を行わずに隠蔽を処理するために、ng-show/ng-hideを使用して、コントローラが正常に動作していました。

0

それはあなたが、あなたは子タブのcontroller別々に使うべきではない欲しいものである場合、私は思います。その状態からcontrollercontrollerAsのプロパティを削除してみてください。これにより、親/子(共有)controllerが一度ロードされます。

+0

子ステートはそれぞれ独自のステート固有のロジックを持っていますので、独自のコントローラ –

+0

が必要です。angularjs 'service'を使用してロジックを保持するとどうなりますか? – Miqe

+0

私はあなたが逃したものを気づくことはできませんが、それはあなたがそれを望むように動作するはずです。これはまた、あなたが望むことをするための別の方法でもあります。また、 'service'を使うことで、コードははるかにクリーナーで乾燥します。 – Miqe

関連する問題