Angularjs 无法在路线更改时更新angular 1应用程序的标题

以下指令提供了当前路由值

(function () {
    var titleDirective=angular.module('titleDirective',[]);
    titleDirective.directive('testTitle',function ($rootScope, $timeout) {
        return {
            restrict: 'E',
            link: function() {
                var listener = function(event, toState) {
                    $timeout(function() {
                        $rootScope.title = (toState.data && toState.data.pageTitle)
                            ? toState.data.pageTitle
                            : 'Default title';
                    });
                };
                $rootScope.$on('$stateChangeSuccess', listener);
            }
        };
    })
})();

我已经定义了如下所示的路线

 .state('admin.signIn', {
            url: '/signIn',
            templateUrl: 'credentials/signIn.html',
            controller: 'loginCtrl',
            data : { pageTitle: 'Home' }
        })

当我尝试在index.html中使用如下所示的指令时

<test-title>{{title}}</test-title>

{{title}

但不确定如何在更改路由时更新html标题标记中的值

<title>Retailer Application</title>

零售商应用程序

不确定如何使用{{title}}来表现出与标题类似的行为

---

请建议一种方法

将您的指令更新为：

myApp.directive('testTitle', function($rootScope, $timeout) {
  return {
    restrict: 'E',
    template: `<title>{{$root.title}}</title>`,
    link: function() {
      var listener = function(event, toState) {
        $timeout(function() {
          $rootScope.title = (toState.data && toState.data.pageTitle) ? toState.data.pageTitle : 'Default title';
        });
      };
      $rootScope.$on('$stateChangeSuccess', listener);
    }
  };
});

myApp.directive（'testTitle'，函数（$rootScope，$timeout）{
返回{
限制：'E'，
模板：`{$root.title}}`，
链接：函数（）{
var listener=函数（事件，toState）{
$timeout（函数（）{
$rootScope.title=（toState.data&&toState.data.pageTitle）？toState.data.pageTitle:“默认标题”；
});
};
$rootScope.$on（“$stateChangeSuccess”，侦听器）；
}
};
});

在这里，当您在模板中为title变量使用$rootScope时，您必须使用

{{{$root.title}

。之后，只需在index.html的head部分添加

测试标题

指令

<test-title>{{title}}</test-title>

还要确保您使用的是0.4.2版本的ui路由器。对于ui路由器的最新版本（1.x），不推荐使用$stateChangeSuccess事件。改用

$transitions.onSuccess

---

&

plunker的例子令人惊讶