繁体   English   中英

使用ngRoute在AngularJS中动态更改页面标题

[英]Changing Page Title Dynamically in AngularJS using ngRoute

尽管我已经设法根据不同的路线来更改页面标题,但当变量进入图片时,我还是被卡住了。

<title ng-bind="title"></title>

角部分

var app = angular.module('myApp', ['ngRoute', 'ngAnimate', 'igTruncate']);

 app.config([ '$routeProvider', '$locationProvider', '$sceDelegateProvider', function($routeProvider, $locationProvider, $sceDelegateProvider){

 $routeProvider
  .when('/', {
    controller: 'BaseController',
    templateUrl: 'views/base.html',
    title: 'Welcome to the Website'
  })
  .when('/about', {
    controller: 'AboutController',
    templateUrl: 'views/about.html',
    title: 'About Me'
  });

}]);

// change Page Title based on the routers
app.run(['$location', '$rootScope', function($location, $rootScope) {
    $rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
        $rootScope.title = current.$$route.title;
    });

}]);   

这工作得很好。 但是自从我创建博客以来,每个博客页面都应该有不同的标题。

我的单条博客路线如下所示

 .when('/blog/post/:url', {
        controller: 'PostController',
        templateUrl: 'views/post.html',
        title:  'Blog'
      })

我想从路线中获取url param并将其合并为我的标题。 例如,如果路由类似于/blog/post/How-to-change-title-in-angularjs ,那么我想获取url部分并将其添加到我的标题中,以便它看起来像How-to-change-title -in-angularjs | 博客

可能吗?

您可以从以下角度的文档中进行检查: https ://docs.angularjs.org/api/ngRoute/service/ $ routeParams

您可以从后端传递标题。 如果没有后端,将其存储在控制器范围内可能会更简单

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM