URL 데이터를 사용하여 AngularJS 클래스 변경하기

Question

페이지를 변경할 때 location.path() 또는 뭔가를 사용하여 요소의 클래스를 변경하고 관련 URL 조각을 가져오고 싶습니다.

라우팅에 $ routeProvider를 사용하고 있습니다. 바이올린은 제대로 표시하지 않지만 내 코드에서 제대로 작동합니다. 내가 겪고있는 문제는 다음 페이지를로드 할 때 업데이트되지 않는다는 것입니다.

이 코드는 내가 원하는 URL 조각을 집어 들고 :

여기

$scope.locationPath = $location.path().replace(/^\/([^\/]*).*$/, '$1'); 

은 매우 간단 JSfiddle입니다 : http://jsfiddle.net/timothybone/kmBXv/1/

Answer 1

답변은 거의 맞습니다.

$scope.$watch(function() { 
    return $location.path(); 
}, function() { 
    return $location.path().replace(/^\/([^\/]*).*$/, '$1'); 
}); 

하는 작업을 바이올린 : 당신이 아니라 한 번, 모든 다이제스트에서 실행 그래서 함수에 $location.path() 포장해야 http://jsfiddle.net/kmBXv/3/

Answer 2

어떻게 이런 일에 대해?

$scope.$watch($location.path(), function() { 
    return $location.path().replace(/^\/([^\/]*).*$/, '$1'); 
} 

Answer 3

$ 시계 사용하는 대신 :에서 다음

<li ng-class="{active:isActiveRoute('edit')}">edit</li> 
<li ng-class="{active:isActiveRoute('list')}">list</li> 

을 귀하의 컨트롤러 :

$scope.isActiveRoute = function(route) { 
    // I added '/' instead of using a regex to remove it from path() 
    return '/' + route === $location.path(); 
}; 

도 참조 AngularJs: stateful client-side routing, 작동하는 바이올린이 있습니다.