Angularjs全栈应用
Angularjs全栈应用
提问于 2014-02-08 16:45:17
大家好，我使用angularjs全栈(yoeman+express+mongodb)应用程序进行开发，我在提供的示例脚手架中开发应用程序。项目的结构是
app
-scripts
-styles
-views
-- admin
--partials
--404.html
--index.html
lib现在我的问题是partials文件夹包含navbar.html和foter.html，它包含在index.html页面中
<div ng-include="'partials/navbar'"></div>
<div style="height:48px;" id="spacer"></div>
<!-- Add your site or application content here -->
<div ng-view=""></div>
<div ng-include="'partials/footer'"></div>所有的html页面在部分有导航栏和页脚，这是可以的，但我希望管理文件夹页面不包含任何这些导航栏和页脚。检查所有的app.js和route.js后，我无法找到要做的设置，以便所有的管理文件夹页面不应该有index.html页面结构。
回答 2
Stack Overflow用户
发布于 2014-02-08 16:57:30
您可以使用第三方路由器，例如angular-ui-router，它具有多个视图和嵌套状态，可以显示不同的视图，也可以根本不显示它们，具体取决于URL。
请参阅：https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views
Stack Overflow用户
发布于 2014-02-09 10:33:18
我推荐使用angular-ui-router，但是如果你坚持使用ngRoute，那么你可以这样做：
<!doctype html>
<html>
<head>
<script src="angular.js"></script>
<script src="angular-route.js"></script>
<script>
var app = angular.module('myApp', ['ngRoute']);
app.config(function ($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'landing.html'
}).when('/admin', {
templateUrl: 'admin.html',
data: {
headerFooterVisible: false
}
});
});
function MainCtrl($scope) {
$scope.$on('$routeChangeSuccess', function (e, current, prev) {
$scope.headerFooterVisible = !current.data || current.data.headerFooterVisible;
});
}
</script>
</head>
<body ng-app="myApp" ng-controller="MainCtrl">
<div ng-show="headerFooterVisible" ng-include="'header.html'"></div>
<div ng-view></div>
<div ng-show="headerFooterVisible" ng-include="'footer.html'"></div>
</body>
</html>通过这种方式，您可以在路由器配置中指定哪些路由应隐藏报头和报尾。对于您不希望看到页眉和页脚的路由，只需将headerFooterVisible: false添加到路由配置的data部分。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21643926
复制相关文章
相似问题
腾讯云开发者
