ui-viewの角型UI-Router ui-view

私はindex.htmlにui-viewを持っています。私は情報用のページを持っています。そこに4つのリンクを持つ2番目のui-viewを入れたいと思います。私のindex.htmlでui-viewの角型UI-Router ui-view

<body ng-app="myApp"> 
    <div ui-view></div> 
</body>

これは私の情報です。 info.htmlのinfo-number.htmlページでデフォルトを開きたい

<div class="col-sm-8" style="border:1px solid; min-height: 
    <h1>Some text</h1> 
    <div ui-sref></div> 
</div>

これは私のアプリです。情報

助けてくれてありがとうのための私のページの

myApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/home'); 
    $stateProvider 
    .state("home", { 
     url: "/home", 
     templateUrl: "home.html" 
    }) 
    .state("info", { 
     url: "/info", 
     templateUrl: "info.html", 
    }) 
    .state("info-number", { 
     abstract: true, 
     parent: "info", 
     url: "/info-number", 
     templateUrl: "info-number.html" 
    }) 
    .state("info-about", { 
     parent: "info", 
     url: "/info-about", 
     templateUrl: "info-about.html" 
    }) 
    .state("info-where", { 
     parent: "info", 
     url: "/info-where", 
     templateUrl: "info-where.html" 
    }) 
    } 
]);

スキーマ。

出典

2017-08-16 mrkibzk

デフォルトの場合でもinfo-numberをabstractにする必要はありません。

abstractビューはinfoである必要があります。ユーザーが「情報」リンク（ボタン）をクリックすると、デフォルトでinfo/info-numberにリダイレクトできます。

私のようにそれを記述します。

$stateProvider 
     .state("home", { 
      url: "/home", 
      templateUrl: "home.html" 
     }) 
     .state("info", { 
      url: "/info", 
      abstract: true, 
      templateUrl: "info.html", 
     }) 
     .state("info.info-number", { 
      url: "/info-number", 
      templateUrl: "info-number.html" 
     }) 
     .state("info.info-about", {     
      url: "/info-about", 
      templateUrl: "info-about.html" 
     }) 
     .state("info.info-where", {    
      url: "/info-where", 
      templateUrl: "info-where.html" 
     })

info.htmlはと類似の構造を有する：

<div> 
    <h1>Some Text</h1> 
    <div ui-view></div> 
</div>

答えを

出典

2017-08-16 09:10:08

こんにちはマキシムTNXを、それが動作します！ – mrkibzk

ui-viewの角型UI-Router ui-view

答えて

関連する問題