2016-03-07 2 views
1

Я пытаюсь добавить viewTitle на основной или корневой веб-страницу приложения, например.Использование глобальной переменной шаблона в контроллерах angularjs

Root Page

<div ng-app="app"> 
    {{viewTitle}} 
    <div ui-view=""></div> 
</div> 

можно изменить viewTitle в контроллерах?

Контроллер-1

var myApp = angular.module(app, []); 
myApp.controller('ChildController', ['$scope', function($scope) { 
    // how to update viewTitle here ? 
}]); 
+1

Вы можете принять помощь от - http://stackoverflow.com/questions/12506329/how-to-dynamically-change-header-based-on-angularjs-partial-view –

+1

Вам не нужно было сначала указывать контроллер для этой части? –

ответ

0

Я думаю, что мы можем использовать $rootScope для этой цели. См. Ниже.

HTML шаблон

<body ng-app="myApp" > 
     {{viewTitle}} 
     <div ui-view=""></div> 
    </div> 
</body> 

JS файл

myApp.config (функция ($ stateProvider, $ urlRouterProvider) {

$urlRouterProvider.otherwise('/home'); 

$stateProvider 
    .state('home', { 
     url: '/', 
     template: '<h1>From nested view </h1>', 
     controller: function($rootScope) 
     { 
      $rootScope.viewTitle = "home"; 
     } 
    }); 

});

Надеется, что это помогает

+0

Я попробовал [это] (http://plnkr.co/edit/bFiqVYkyn3sQKmJM8JD2?p=preview), не думаю, что это сработает правильно. –

+0

Да, вы правы. –

2

Одним из решений могут быть это: Если вы используете UI-маршрутизатор, вы можете добавить заголовок в состояния: (Я использую это, чтобы перевести название)

.state('login', { 
      url: '/login', 
      controller: 'AdminLoginController', 
      templateUrl: 'app/admin/views/login.html', 
      title: { 
       'es': 'Iniciar sesión', 
       'en': 'Login', 
       'de': 'Einloggen' 
      } 
     }) 
.state('panelAdmin', { 
      url: '', 
      controller: 'AdminHomeController', 
      templateUrl: 'app/admin/views/panelAdmin.html', 
      title: { 
       'es': 'Panel de administración', 
       'en': 'Control panel', 
       'de': 'Führungspanel' 
      } 
     }) 

И в $ stateChangeStart перезагружать название:

$rootScope.$on("$stateChangeStart", function (event, toState, toParams, fromState, fromParams) { 

    if (toState.title) { 
    $rootScope.title = toState.title[$rootScope.cultureLang]; 
    } 

}); 

В index.html:

<title>{{title}}</title> 
Смежные вопросы