속성에 따라 동적으로 변경되는 각도 지시문

Question

특정 속성이 변경 될 때마다 template/templateUrl을 변경하려고합니다. 현재 초기 이미지를 올바르게로드하지만 업데이트시 변경되지 않는 다음과 같은 사항이 있습니다.

.directive('parkingImage', ['$compile', function($compile) { 
    return { 
     restrict: 'E', 
     scope: { 
      image: '=' 
     }, 
     link: function(scope,element,attrs) { 
      scope.contentUrl = 'img/parking/'+attrs.templateUrl+'.svg'; 
      attrs.$observe("template-url", function(v){ 
       scope.contentUrl = 'img/parking/'+v+'.svg'; 
      }); 
     }, 
     template: '<div ng-include="contentUrl"></div>' 
    } 
}]); 

및 HTML <parking-image id="parking-image" template-url="Area_2"></parking-image>

에서

나는이 Angular.js directive dynamic templateURL에서 살펴 보았다,하지만 제대로 작동하지 않는 것 같습니다.

Answer 1

올바른 접근 방식은 templateUrl 오히려 template-url보다에 관찰하는 것입니다 : 그것은 이제 초기 페이지로드 업데이트

attrs.$observe("templateUrl", function(v){ 
    scope.contentUrl = 'img/parking/'+v+'.svg'; 
});