为什么我的视图没有出现在angular-ui-router中?

时间:2016-04-27 15:38:35

标签: angularjs angular-ui-router

以下是我拥有的路由器状态:

var homeWords = {
    name: 'home.words',
    url: 'words',
    views: {
        'home@': {
            templateUrl: 'app/admin/word/words.html'
        }
    }
};

var homeWordsWord = {
    name: 'home.words.word',
    url: '/:wordId',
};

var homeWordsWordEdit = {
    name: 'home.words.word.edit',
    url: '/edit',
    templateUrl: 'app/admin/word/word.html',
};

和我的words.html:

<div class="mw100p"
     ng-show="$state.is('home.words')  || $state.is('home.words.word')">
    <ng-include src="'/app/admin/word/words-controls.html'"></ng-include>
    <ng-include src="'/app/admin/word/words-grid.html'"></ng-include>
    <div class="grid form contentInnerPanel w100p"
         ng-show="exs.gridNoDataMessage != null"
         style="margin-top: 0; border-top: none;">
        <div class="gridBody">
            <div>
                <div><div>{{wos.gridNoDataMessage}}</div></div>
            </div>
        </div>
    </div>
</div>
<div ui-view></div>

当我选择home.words视图时,我会看到HTML的第一部分。当我选择home.words.word视图时,我会看到HTML的第一部分。

当我选择home.words.word.edit视图时,我什么也没看到。

我应该更改<div ui-view></div>以使用视图名称,并以某种方式在homeWordsWordEdit的templateUrl中指定它

1 个答案:

答案 0 :(得分:1)

因为您未在?:中提及ui-view指令的模板,因此home.words.word状态的包装view作为其home.words.word.edit的子项}。

home.words.word