如何動態設置Angular JS頁面的標題？

Question

我有一個正在運行的單頁AngularJS Web應用程序。要管理我的路線，我正在使用ui.router。這裏是我的閃屏狀態：

$stateProvider.state('splash', 
     { 
      url: '/', 
      templateUrl: 'html/splash.html', 
      controller: 'SplashCtrl', 
      data: { 
       meta: { 
       'title': 'Splash Screen' 
       } 
      } 
     } 
); 

你有沒有注意到，這種狀態包含data.meta對象？這是因爲我使用ngMeta來填充頁面的<title></title>標籤。一切正常。

但是，我想標題是動態的，而不是靜態的。我想在SplashCtrl中設置/調整它。但我不知道該怎麼做。有人能告訴我嗎？在HTML模板，我解決這個問題是這樣的：<title>{{ngMeta.title}}</title>

Answer 1

你可以在你的控制器注入NG-元，然後動態設置meta標籤如下

app.controller('YourController',["$scope", "ngMeta",function ($scope,ngMeta) { 
    ngMeta.setTitle('Home page'); 
    ngMeta.setTag('description', 'This is the home page'); 
    ngMeta.setTag('keywords', 'angular,stack,nodejs'); 
    ngMeta.setTag('author', 'Tony '); 
}]);