2013-05-03 9 views
10

子ビュー(ネストされたビュー)をレンダリングするには、親ビューを抽象にする必要があるのはなぜですか?ui-router親ステートが抽象でなければならない理由

$stateProvider 
      .state('A', {url: '/A', abstract: true, templateUrl: 'views/A.html'}) 
      .state('A.B', {url: '', abstract: true, templateUrl: 'views/B.html'}) 
      .state('A.B.C', {url:'', abstract:false, templateUrl:'views/C.html'}); 

親ビュー '' 以下のようhome.htmlでホストされている:親状態 'A' または 'B' のいずれかが抽象的= falseをUIとしてマークされている場合

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Yomingo</title> 
    <link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet"/> 
    <link href="lib/bootstrap/css/bootstrap-responsive.css" rel="stylesheet"/> 
</head> 
<body> 
    <div ui-view> 
    </div> 
<script type="text/javascript" data-main="scripts/main" src="lib/require/require.js"></script> 
</body> 
</html> 

-viewコンテンツはレンダリングされません。

+1

あなたのアプリケーションページはhome.htmlで、親ビューAのテンプレートは実際にviews/A.htmlにあるとしましょう... views/A.htmlとviews/B.htmlを共有する必要があります。子ビューが親ビューに配置されています。 – laurelnaiad

答えて

6

私は同様の問題を抱えています。

  • :: '/ A'
  • AB: '/ A' + ''
  • ABC

    あなたの3つの状態がすべて同じURLを使用して、/ Aです: '/ A' + '' + ''

URLが定義されているため、現在の状態はyoに基づいて選択されますur現在のURL。一度に1つの状態にしか収めることができないため、おそらく選択される状態は最初に定義された状態です。

AとA.Bの状態を抽象化すると、遷移することはできず、/ Aを参照するときには考慮されません。したがって、A.B.Cが選択され、A.BおよびA.から継承されます。

一度に複数のビューを表示する場合は、multiple named viewsのドキュメントを読みやすくすることをお勧めします。

関連する問題