ui-view内のui-viewが表示されない

Angular UI-RouterとそのUIビューに関する質問があります。私は3つのui-viewsを別のものの中に宣言し、唯一のものは "言語"という名前のものです。なぜこのようなことが起こるのか、誰かがそれを助けて偉大なものになるのを理解できない。 https://plnkr.co/edit/z8cFGHKVQNN623QbBUqi ui-view内のui-viewが表示されない

出典

2016-11-07 gqmartins

plsはplunkerコードを添付します。 –

すでにプラカードリンクが追加されています – gqmartins

これらのチュートリアルを理解するために、https://scotch.io/tutorials/angular-routing-using-u-router https://github.com/angular-ui/ui-router/wiki/をご覧ください。複数の名前付きビュー＃view-names --- relative-vs-absolute-names –

私がしました：

のindex.html：

<div ui-view="languages"> 
    <div ui-view="dashboard"></div> 
    <div ui-view="partners"></div> 
    <div ui-view="footer"></div> 
</div>

routes.js：私は仕事にそれを得ることができませんでしたが、

angular.module('TMHM') 
.config(routeConfig); 

routeConfig.$inject = ['$stateProvider', '$urlRouterProvider']; 

function routeConfig ($stateProvider, $urlRouterProvider) { 

    $stateProvider 
    .state('home', { 
     url: '/', 
     views: { 
     'languages': { 
      templateUrl: 'views/languages/languages.html' 
     }, 
     'dashboard': { 
      templateUrl: 'views/dashboard/dashboard.html' 
     }, 
     'partners': { 
      templateUrl: 'views/partners/partners.html' 
     }, 
     'footer': { 
      templateUrl: 'views/footer/footer.html' 
     } 
     } 
    }); 

    $urlRouterProvider.otherwise('/'); 
};

ここPlunkerコードは、です前にこのようにしたことは決して見られませんでした（ルーテッドビューのルーテッドビュー）。それはうまくいかないかもしれないし、私は決してそれに遭遇したことがないかもしれない、私は知らない。私はビューをトップレベルと考える傾向があり、ネストされたコンテンツとして含まれています。それはアイデアだ場合

、私はこれに非常に似た何かをやったが、私はNG-は、（私は現在、多くのユーザーにサービスを提供するアプリでの生産でこれを持っている）を使用：

<div ng-include="mycontroller.pathToFileIWantToShow"></div> 
// alternatively, although hardcoding can be evil... 
<div ng-include="path/to/some/file.html"></div>

これをコンテンツを動的に変更したり、バインディングなどを使用したり、含まれている各テンプレートは独自のコントローラを参照したり、それをラップするコントローラを使用することができます。私はどれくらい巣を入れても問題ないようです。

<div ui-view=""></div>

そして状態調整を含むようにindex.htmlを

出典

2016-11-07 13:49:16

あり、更新されており、このコンテンツ

<h1>Routes</h1> 

<hr /> 
<div ui-view="languages"></div> 
<div ui-view="dashboard"></div> 
<div ui-view="partners"></div> 
<div ui-view="footer"></div>

で、plunker https://plnkr.co/edit/vKOr2yLUfaAfwoGyK0ws?p=preview

私は新しいroutes.htmlを作成する作業と変更：

また

.state('home', { 
    url: '/', 
    views: { 
    '': { 
     templateUrl: 'routes.html' 
    }, 
    '[email protected]': { 
     templateUrl: 'languages.html' 
    }, 
    '[email protected]': { 
     templateUrl: 'dashboard.html' 
    }, 
    '[email protected]': { 
     templateUrl: 'partners.html' 
    }, 
    '[email protected]': { 
     templateUrl: 'footer.html' 
    } 
    } 
});

、不可欠それを名前を付けてマルチビューについてhere

詳細と例チェック

<html ng-app="TMHM"> 

    <head >

<head><html>に要素からng-appを移動しました：

出典

2016-11-07 14:11:17

私が欲しかったのは正確ではありませんが、私の問題を多く解決する助けになりました。どうもありがとうございました！ – gqmartins

とにかくheplpedすれば素晴らしい;）素晴らしいUI-Router –

ui-view内のui-viewが表示されない

答えて

関連する問題