使用angularjs路由更改頁面的標題

我想使用路由來更改我的頁面的頁面標題，到目前爲止，我的標題正在改變，但是我的網址正被添加到標題中。任何線索爲什麼？使用angularjs路由更改頁面的標題

的index.html：

<title ng-bind-html="title ">Website Name</title>

JS文件

app.config(function($stateProvider,$urlRouterProvider) { 
     .state('dashboard', { 
      url: "/dashboard", 
      templateUrl: "partials/content/dashboard.html", 
      controller: "dashboardCtrl" 
     }) 
}); 

app.run(function ($rootScope, $state, $stateParams) { 
     //set it here 
    $rootScope.title = $state.current.title;   
});

來源

2016-02-12 Miss Doubtfire

只是把它變成數據：

app.config(function($stateProvider,$urlRouterProvider) { 
    .state('dashboard', { 
     url: "/dashboard", 
     templateUrl:  "partials/content/dashboard.html", 
     controller: "dashboardCtrl", 
     data: { 
      title: 'Dashboard title' 
      } 
}) });

來源

2016-02-12 11:40:11

仍顯示我的位置標題的URL –

$ rootScope.title = $ state.current.data.title; –

使用$routeChangeSuccess。

app.run(['$location', '$rootScope', function($location, $rootScope) { 
     $rootScope.$on('$routeChangeSuccess', function (event, current, previous) { 
      $rootScope.title = current.$$route.title; 
     }); 
    }]);

然後在的Html，使用ng-bind

<!DOCTYPE html> 
<html ng-app="myApp"> 
<head> 
    <title ng-bind="'myApp &mdash; ' + title">myApp</title>

來源

2016-02-12 11:40:29 NeiL

仍然顯示網址代替網頁標題 –

可否詳細說明一下，你是如何實現的？ – NeiL

我在我的控制器中簡單地使用了這個 $ rootScope.title ='my title'; 和您提到的相同的HTML。 –

您需要使用title屬性的$routeProvider的when功能，像這樣：

var module = angular.module('yourApp.routes', []); 

module.config([ 
    '$routeProvider', function ($routeProvider) { 
     $routeProvider 
      .when('/dashboard', { 
       title: 'Dashboard', 
       templateUrl: "partials/content/dashboard.html", 
       controller: "dashboardCtrl" 
       }) 
    } 
]); 

return module;

標題可以$scope或在視圖中進行訪問：

<h1 data-ng-bind="::title"></h1>

來源

2017-02-01 17:33:47

使用angularjs路由更改頁面的標題

回答

相關問題