0

これはよくある質問だと思いますが、私の「ググる」スキルが私が望むものを得るのに十分ではないかもしれません.

だから私はng-viewそれがメインのindex.htmlであるページを持っています

<div class="row" style="margin-top: 70px;" ui-view></div>

これで、 student.htmlのテンプレート URL を持つビューができました

<div class="col-md-10 col-md-offset-1" ng-controller="Controller_Parent">
<div ng-cloak>
    <md-tabs md-dynamic-height md-border-bottom>
        <md-tab label="View Profile" ui-view="student.profile">
        </md-tab>
        <md-tab label="View Results" ui-view="student.result">
        </md-tab>
        <md-tab label="View Attendance" ui-view="student.attendance">
        </md-tab>
    </md-tabs>
</div>
</div>

コードが示唆しているように、Controller_Aそれぞれ独自のテンプレートを持つ 3 つのビュー (正しいサブビュー) が必要です。

ルーティング コードは次のとおりです。

app.config(function($stateProvider, $urlRouterProvider) {    
    $urlRouterProvider.otherwise('/');
    $stateProvider
    .state('home', {
        url: '/',
        templateUrl: 'templates/login.html',
    }).state('student',{
        url:'/student',
        views:{
            '@':{
                templateUrl: 'templates/student.html',
            },
            'profile@student':{
                templateUrl:'templates/student/profile.html'
            },
        }
    });
});

このアイデアを機能させるには、どのような変更を加える必要がありますか。私はチュートリアルを完了しましたが、残念ながらどれも同様の機能を持っていないか、間違ったスペースを探している可能性があります.

あなたの入力を待っています。よろしく！

PS: JS エラーはスローされません

4

2 に答える 2

1

https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views#view-names---relative-vs-absolute-namesをご覧ください。student.profile参照構文（ ）のようにビュー名を混在させているようviewname@statenameです。したがってstudent.、テンプレートで を省略してみてください。

また、コントローラーを直接テンプレートではなく、状態構成 (おそらく共通の親状態) に登録する必要があります...

于 2016-07-27T12:00:52.697 に答える
1

あなたのコードに似たjsfiddleを作成しましたが、動作します。主な違いは、ui-view ディレクティブ内のネストされたビューの前にプレフィックスを付けないことです。student.

http://jsfiddle.net/irhabi/3ozfxmfx/ 

<md-tab label="View Profile" ui-view="profile"></md-tab>
<md-tab label="View Results" ui-view="result"></md-tab>
<md-tab label="View Attendance" ui-view="attendance"></md-tab>
于 2016-07-27T12:07:51.183 に答える