2016-08-17 4 views
1

誰かがこの問題を手伝ってくれますか?ui-routerを使って、anglejsのルートルートに2つのテンプレートをロード

.state('home',{ 
     url:'home', 
     controller: 'mainCtrl', 
     templateUrl: 'index.html' 
    }) 

    .state('home.profile',{ 
     url:'/profile', 
     controller: 'proCtrl', 
     templateUrl: 'profile.html' 
    }) 

    .state('home.category',{ 
     url:'/category', 
     controller: 'cateCtrl', 
     templateUrl: 'category.html' 
    }) 

私のインデックスページは、私がindex.htmlを両方ロードしても、別のテンプレートを読み込むことができるような状況を望んでください。この

<div class="col-sm-12 no-padding"> 
    <div class="col-sm-3 hidden-xs"> 
     <div class="col-xs-12"> 
      <ul class="nav panel-group rm-border"> 
       <li> 
        <a click-toggle ui-sref-active="active" class="row" ui-sref="home.profile">Profile</a> 
       </li> 
       <li> 
        <a click-toggle ui-sref-active="active" class="row" ui-sref="home.category">category</a> 
       </li> 
      </ul> 
     </div><br clear="all"> 
    </div> 
    <div class="col-sm-9 no-padding"> 
     <div class="row panel-heading rm-border no-margin"> 
      <h4 class="panel-title"> {{title}}</h4> 
     </div> 
     <div class="row no-margin" ui-view></div> 
    </div> 
</div> 

のようなものであるとき、私のルート「/ホーム」ルートにワンクリック。あなたのHomecategoryページを持っている必要があります

+0

otherwise文を追加して/ homeに移動してみてください – Ladmerc

答えて

0

があなたを取得しますUI Routerガイドに続いて、レイアウト

HOME

<div> 
show some cool things 
</div> 
<div ui-view></div> 

CATEGORY

<div> 
cool category things 
</div> 

のこのタイプを持っています。しかし、本質的には「ネストされた」別のビューを持っている必要がありますビューはdivまたは別のhtml elementがそれに彼らのPlunker

0

迅速なリンクをui-view属性を持っている必要があります皆さんありがとう、私はちょうどでしたリダイレクト。それは私の問題を解決する。

関連する問題