경로 변경

Question

다음 지시어는 현재 경로 값

(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' } 
     }) 

아래와 같이 내가 경로를 정의가에 각 1 응용 프로그램의 제목을 업데이트 할 수 없습니다 아래 지시문을 index.html에 사용하려면

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

그러나 val을 업데이트하는 방법을 모르는 경우 변화에 대한 HTML 경로의 제목 태그에 UE

<title>Retailer Application</title> 

그것을

Answer 1

업데이트를 할

제안하십시오 방법을 {{제목}} 제목처럼 행동하기를 사용하는 방법을하지 않도록 에 당신의 지침 : 당신이했습니다 다음은 템플릿에 제목 변수 $의 rootScope를 사용으로

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

는 {{$root.title}}를 사용합니다. 그건 그냥 index.html을

Working Plunker

의 머리 부분에 test-title 지시문을 추가 한 후 또한이 UI 라우터의 0.4.2 버전을 사용하고 있는지 확인하십시오. 최근 버전 (1.x)의 ui-router $ stateChangeSuccess 이벤트는 더 이상 사용되지 않습니다. 대신 $transitions.onSuccess을 사용하십시오.

Official Documentation & issue