根据控制器中的数据，使用Angular和UI-Router设置页面标题

I'm currently using the directive found in this question to change my page titles.

我目前正在使用此问题中的指令来更改我的页面标题。

Set Page title using UI-Router

使用UI-Router设置页面标题

Then, in my app.js file, I append the pageTitle to data, like so:

然后,在我的app.js文件中,我将pageTitle附加到数据,如下所示:

.state('home', {
  url: '/home'
  templateUrl: 'home.html'
  controller: 'homeController'
  data: {
    pageTitle: 'Home'
  }
})

But say, for instance, if homeController had a $scope.todaysDate variable that was fetched from a service. Is there a way to access that variable in my router, so I can change data and pageTitle to something like:

但是,例如,如果homeController有一个从服务中获取的$ scope.todaysDate变量。有没有办法在我的路由器中访问该变量,所以我可以将数据和pageTitle更改为:

data: {
  pageTitle: 'Home ' + $scope.todaysDate
}

I'm able to go into the controller and using $rootScope.pageTitle = 'some value' I can see it changes the variable to 'some value' when I look in the Batarang console tool, but the actual page title doesn't change.

我能够进入控制器并使用$ rootScope.pageTitle ='some value'当我查看Batarang控制台工具时,我可以看到它将变量更改为“某个值”,但实际的页面标题不会改变。

1 个解决方案

#1

Maybe a resolve would work in this case. If you want to make sure some data is always available to a state controller you can use a resolve. For example lets say I had a service called, "calendar" and it exposes a function called, "getTodaysDate". I could do the following:

也许在这种情况下解决方案可行。如果要确保状态控制器始终可以使用某些数据,则可以使用解析。例如,假设我有一个名为“calendar”的服务,它公开了一个名为“getTodaysDate”的函数。我可以做以下事情:

.state('home', {
    url: '/home',
    templateUrl: 'home.html',
    controller: 'homeController',
    resolve:{
            pageTitle:  function(calendar){
            return 'Home ' + calendar.getTodaysDate();
        }
    }
})

Now "pageTitle" will be resolved and injected into "homeController" before the state change. Hope this helps.

现在“pageTitle”将被解析并在状态改变之前注入“homeController”。希望这可以帮助。