How to dynamically set an Angular JS page's Title?

。_饼干妹妹 提交于 2020-01-05 07:32:33

问题


I have a running single-page AngularJS Web Application. To manage my routes, I'm using ui.router. Here is the state for my Splash Screen:

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

Did you notice that this state contains a data.meta object? That's because I'm using ngMeta to populate the page's <title></title> tag. Everything works.

However, I want to the title to be dynamic, not static. I want to set/adjust it in the SplashCtrl. But I don't know how to do that. Can someone show me? In the HTML template, I address it like this: <title>{{ngMeta.title}}</title>


回答1:


You can inject ng-meta in your controller and then set meta tags dynamically as below

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 ');
}]);


来源:https://stackoverflow.com/questions/44060648/how-to-dynamically-set-an-angular-js-pages-title

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!