为什么我无法在AngularJs中使用多视图

时间:2015-06-16 00:12:21

标签: angularjs twitter-bootstrap

我有以下代码。问题是它没有显示任何一个视图。我究竟做错了什么?

QProcess::startDetached();

这是标记。



.state('app.accessmanager.user.reactivate', {

    url: '/reactivate',
    Views: {
        '': {templateUrl: 'assets/views/accessmanager/reactivate.html'},
        title: 'ReActivate User',
        icon: 'ti-layout-media-left-alt',
        ncyBreadcrumb: {
            label: 'ReActivate User'
        },
        'sideBar': {templateUrl: 'assets/views/partials/AMSidebar.html'}
        }




如果我执行以下操作,它至少会显示侧边栏,但不会显示主要内容。

<div class="sidebar app-aside" id="sidebar" toggleable parent-active-class="app-slide-off" >
    <div perfect-scrollbar wheel-propagation="false" suppress-scroll-x="true" class="sidebar-container">
        <div ui-view="sideBar"></div>
    </div>
</div>
<div class="app-content" ng-class="{loading: loading}">
	<header data-ng-include=" 'assets/views/partials/top-navbar.html' " class="navbar navbar-default navbar-static-top"></header>
	<div data-ng-include=" 'assets/views/partials/main-content.html' " class="main-content" ></div>
</div>

2 个答案:

答案 0 :(得分:0)

由于缺乏代码,我只能假设:

尝试替换:

Views: {
    '': {templateUrl: 'assets/views/accessmanager/reactivate.html'},
    title: 'ReActivate User',
    icon: 'ti-layout-media-left-alt',
    ncyBreadcrumb: {
        label: 'ReActivate User'

    },
    'sideBar': {templateUrl: 'assets/views/partials/AMSidebar.html'}
    }

views: {
    '': {templateUrl: 'assets/views/accessmanager/reactivate.html',
    title: 'ReActivate User',
    icon: 'ti-layout-media-left-alt',
    ncyBreadcrumb: {
        label: 'ReActivate User'
     } // ADDED AFTER EDIT
    },
    'sideBar': {templateUrl: 'assets/views/partials/AMSidebar.html'}
    }
}

我稍微修改了视图的JSON结构:

答案 1 :(得分:0)

我想出来了!!!

.state('app.accessmanager.user.reactivate', {
    url: '/reactivate',
        views: {
            'sidebar@app': {templateUrl: 'assets/views/partials/AccessManagerNav.html'},
            '':  {templateUrl: "assets/views/accessmanager/reactivate.html",
            title: 'ReActivate User',
            icon: 'ti-layout-media-left-alt',
            ncyBreadcrumb: {label: 'ReActivate User'}
            }
        }
    }

注意带有应用程序的侧边栏后面的@是状态。此外,如果您要使用其他属性,则必须将它们包含在{}中,就像我在第二个templateUrl中所做的那样。