我的Angular应用程序有一个index.html,主体内只有一个<div ng-view></div>
。在加载时,将通过$ routeProvider向用户显示来自单个局部视图的登录屏幕,并且在登录成功时,路径将更改为已登录的部分:
$routeProvider.
when('/login', {templateUrl: 'partials/login.html', controller: 'LoginCtrl'}).
when('/loggedin', {templateUrl: 'partials/loggedin_part.html', controller: 'UserCtrl'}).
otherwise({redirectTo: '/login'});
登录后,我希望同时显示三个单独的部分:信息栏,导航和主要(主要可以与当前正在查看的任何导航项目互换)。目前在我的loggedin_part.html中我有:
<ng-include src="'partials/infobar_part.html'"></ng-include>
<ng-include src="'partials/nav_part.html'"></ng-include>
<ng-include src="'partials/main_part.html'"></ng-include>
我的问题是,是否有更有效的方式通过$ routeProvider提供不同的子视图?使用我当前的方法,我将创建“持有者”部分,例如上面每个导航项目/路线的loggedin_part.html,即(假设):
loggedin_admin_part.html
<ng-include src="'partials/infobar_part.html'"></ng-include>
<ng-include src="'partials/nav_part.html'"></ng-include>
<ng-include src="'partials/admin_part.html'"></ng-include>
路线
$routeProvider.
when('/login', {templateUrl: 'partials/login.html', controller: 'LoginCtrl'}).
when('/loggedin', {templateUrl: 'partials/loggedin_part.html', controller: 'UserCtrl'}).
when('/admin', {templateUrl: 'partials/loggedin_admin_part.html', controller: 'AdminCtrl'}).
otherwise({redirectTo: '/login'});
每个导航组的等等。是否有可能跳过“持有人”部分并且每条路线有条件地服务多个部分? (注意,我知道语法错误,这是我想说明的想法):
$routeProvider.
when('/login', {templateUrl: 'partials/login.html', controller: 'LoginCtrl'}).
when('/loggedin', {templateUrl: 'partials/infobar_part.html', 'partials/nav_part.html', 'partials/main_part.html', controller: 'UserCtrl'}).
when('/admin', {templateUrl: 'partials/infobar_part.html', 'partials/nav_part.html', 'partials/admin_part.html', controller: 'AdminCtrl'}).
otherwise({redirectTo: '/login'});
答案 0 :(得分:4)
我会解决这个问题,改变你认为是偏的。
例如:不要将'login'和'logedIn'视为两个不同的部分。您可以使用部分调用,例如loginStatus_bar。这部分有两个(或更多)可能的状态(login,loggedIn等等)
在“loginStatus_bar”部分中,您可以编写所有可能的栏,然后使用ng-show,ng-hide有条件地显示必要的内容。
像这样的东西(其中'isLoggedIn'是范围内的布尔值):
<div ng-show="isLoggedIn" ng-controller="loggedInBar" >
</div>
<div ng-hide="isLoggedIn" ng-controller="loginBar" >
</div>
通过这种方式,您甚至不需要路由,因为,“loginStatus_bar”部分可能始终在您的应用程序中以一种状态或其他状态显示。