전화 서비스 방법

Question

은 이제 나는 지시 있다고 가정 해 봅시다 :

1. 어떻게 내부 이미지 원본 경로에 액세스합니까?
2. 이 경로를 서비스 MyService으로 전달하려면 어떻게해야합니까?

업데이트 솔루션 (라이트 박스 래퍼 생각) :

app.directive("component", function(LightboxService) { 
    return { 
     restrict: 'E', 
     transclude: true, 
     replace: true, 
     template: "<a href='' ng-click='lb()' ng-transclude></a>", 
     link: function (scope, element, attrs) { 
      scope.lb = function() { 
       var src = $(element).find("img").attr("src"); 
       LightboxService.show(src); 
      } 
     } 
    } 
}); 

Answer 1

1. 당신은 컨트롤러 범위에 바인딩하거나 속성을 사용하여 링크 방법에서 하나의 소스 경로에 액세스 할 수 있습니다 .

2. 템플릿에서 서비스에 액세스 할 수 없습니다. 서비스에 컨트롤러를 삽입하고 $ scope에 함수를 정의하여 템플릿에서 호출해야합니다.

아래 지침 확인 :

app.directive("component", function() { 
    return { 
     scope: { 
      ngSrc: "@", //Text Binding 
     }, 
     controller: function($scope, MyService) { 
      $scope.doThings = function() { 
       MyService.doThings(); 
      } 
     }, 
     restrict: 'E', 
     transclude: true, 
     template: "<a href='{{ng-src}}' ng-click='doThings' ng-transclude></a>" 
    } 
}); 

현재 격리 된 범위와 지침에 대해 자세히 배울 수 있습니다 : 내가 링크 방법을 시도했습니다 https://umur.io/angularjs-directives-using-isolated-scope-with-attributes/