AngularJS UIルーターアップデート兄弟ビュー

Question

私は角度を使って作業していて、uiルータを使用しています。今私は、左のパネルから項目を選択した場合、APIは、その項目の詳細を取得するために呼び出され

<div ui-view> 
    <div ui-view="left"> 
     -- list of items 
    </div> 
    <div ui-view="right"> 
     -- details of item 
    </div> 
</div> 

：私のビューの構造は、このようなものです。その情報を適切な視点でロードしたい。

すべてのビューステートにはそれぞれ独自のコントローラがあります。返されたデータをAPIビューから2番目のビューに渡すために助けてもらえますか？

Answer 1

これは、ui-routerのかなり簡単で一般的な使用例です。主なコンセプトはnested statesとmultiple named-viewsです。

私のようなものに見えるいくつかの州でこれを設定します：user.detailsがあるので

<a ui-sref="user.details({userId: user.id})">{{user.name}}</a> 

：ユーザーリストテンプレートで

$stateProvider 
    .state('user', { 
     url: '/user', 
     views: { 
      'left': { 
       templateUrl: '/templates/states/user-list.tpl.html' 
      }, 
      'right': { 
       template: '<p>This is default content that would appear in the right view until a user is selected. This is nice, but is completely optional.</p>' 
      } 
     } 
    }) 
    .state('user.details', { 
     url: '/:userId', 
     views: { 
      'right': { 
       templateUrl: '/templates/states/user-details.tpl.html' 
      } 
     } 
    }); 

を、あなたは、リンクにのようなものを使用します子の状態がuserの場合、ユーザーリストは、左側のビューにロードされたまま、右側のビューで別のユーザーをナビゲートします。