角度uiRouterはテンプレート内の各コンポーネントをリロードします

Question

私は自分のアプリのルートとビューを定義するためにUIRouterを使用しています。

ここで間違っていることは、私がルートに行くたびに、「進行中の」ルートルールで定義されたすべてのビュー、つまり古いルートから変更されていないビューも再ロードされることです。これはコントローラをリセットし、私を怒らせます。 私はこれらのビューを私の一般的なテンプレートにコーディングしたくないので、マニュアルの<ng-include ng-if="blah">を使用しないでください。他の解決方法はありますか？

ここは私のルート設定です。あなたが見ることができるように、両方のルートは非常に同じ意見を持っています。 左、中央、右のビューは、home.htmlの中に配置され、「ホーム」ルールに割り当てられます。

$stateProvider 
    .state('home', { 
    url: '/home' 
    templateUrl: 'app/components/templates/home.html', 
    abstract: true, 
    views: { 
     'header': { 
      templateUrl: 'app/components/header/headerView.html' 
     }, 
     '': { 
      templateUrl: 'app/components/templates/home.html' 
     } 
    } 
    }) 
    .state('home.account', { 
    url: '', 
    abstract: true, 
    views:{ 
     'left': { 
      templateUrl : 'app/components/accountList/accountListView.html' 
     }, 
     'center': { 
      templateUrl : '<ui-view/>' 
     }, 
     'right': { 
      templateUrl : 'app/components/accountWallet/accountWalletView.html' 
     } 
    } 
    }) 
    .state('home.account.twitter', { 
    url: '/twitter', 
    views:{ 
     'center': { 
      templateUrl : 'app/components/timeline/timelineView.html' 
     } 
    } 
    }) 
    .state('home.account.link', { 
    url: '/link', 
    views:{ 
     'center': { 
      templateUrl : 'app/components/timeline/timelineView.html' 
     } 
    } 
    }); 

：

$stateProvider 
    .state('home', { 
     templateUrl: 'app/components/templates/home.html', 
     abstract: true, 
     views: { 
      'header': { 
       templateUrl: 'app/components/header/headerView.html' 
      }, 
      '': { 
       templateUrl: 'app/components/templates/home.html' 
      } 
     } 
    }) 
    .state('home.twitter', { 
     url: '/home/twitter', 
     views:{ 
      'left': { 
       templateUrl : 'app/components/accountList/accountListView.html' 
      }, 
      'center': { 
       templateUrl : 'app/components/timeline/timelineView.html' 
      }, 
      'right': { 
       templateUrl : 'app/components/accountWallet/accountWalletView.html' 
      } 
     } 
    }) 
     .state('home.link', { 
     url: '/home/link', 
     views:{ 
      'left': { 
       templateUrl : 'app/components/accountList/accountListView.html' 
      }, 
      'center': { 
       templateUrl : 'app/components/timeline/timelineView.html' 
      }, 
      'right': { 
       templateUrl : 'app/components/accountWallet/accountWalletView.html' 
      } 
     } 
    }); 

Answer 1

leftとrightのみこれらの2つの状態間で共有され、homeの他の子供たちのために異なる可能性があると仮定すると、あなたは彼らが中心ビューから分離しておくために、別の抽象化レイヤーを必要としますhome.account.twitterからhome.account.linkに移動すると、左右のビューは同じままになります。つまり、実際にleftとrightビューを別の状態ではなく、親の抽象的な状態に統合できるのは明らかです。