AngularJS无法添加页面标题 [英] AngularJS trouble adding page titles
问题描述
我写使用AngularJS一个Web应用程序。它不是一个单一的页面应用程序，但我所有的codeS都在一个文件 - index.ejs。
I am writing a web app using AngularJS. It is not a single page application but all my codes are in one file- index.ejs.
因此，我成立了index.ejs大致是这样的：
So my set up for index.ejs roughly looks like this:
<head>
<title> Main page </title>
</head>
<body>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<ui-view></ui-view>
</div>
</div>
<script type = "text/ng-template" id = "/main.html">
.....
</script>
<script type = "text/ng-template" id = "/addStuff.html">
.....
</script>
<script type = "text/ng-template" id = "/searchStuff.html">
.....
</script>
<script type = "text/ng-template" id = "/about.html">
.....
</script>
</body>
我对index.ejs顶部的主要页面的标题。我也想有单独的标题为每个网页所以当他们在新标签打开，我知道哪一个是哪个。我曾尝试这样做的：
I have a title for the main page on top of index.ejs. I would also like to have seperate titles for each page so when they are opened in a new tab, I know which one is which. I have tried doing:
<script type = "text/ng-template" id = "/addStuff.html">
<head>
<title> Add Stuff </title>
</head>
.....
但是，这并不正常工作。有任何想法吗？谢谢你。
But this doesn't work. Any ideas? Thanks.
推荐答案
您应该使用UI的路由器。在这种情况下，您可以在体或 HTML 元素，例如
You should use ui-router. In which case you can add a top level controller on the body or html element, for example <html ng-app="my-app" ng-controller="AppCtrl">
，并添加$ stateChangeSuccess监听器每当一个新的路径加载中...
And add a '$stateChangeSuccess' listener whenever a new route is loaded...
.controller('AppCtrl', function AppCtrl($scope) {
$scope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {
if (angular.isDefined(toState.data.pageTitle)) {
$scope.pageTitle = toState.data.pageTitle;
}
});
})
然后在路由定义可以添加一个名为属性 data.pageTitle
$stateProvider.state( 'profile', {
url: '/profile',
views: {
"main": {
controller: 'ProfileCtrl',
templateUrl: 'profile/profile.tpl.html'
}
},
data:{
pageTitle: 'Profile'
}
})
然后在你的主index.html文件，你可以绑定 PAGETITLE 属性：
<title ng-bind="pageTitle"></title>
这篇关于AngularJS无法添加页面标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
