DOM을 조작하는 AngularJS 지시문과 통신

Question

<li>을 클릭하고 ngClick과 함께 일부 데이터를 보낼 수있는 간단한 한 페이지 앱을 현재 개발 중입니다. 이 <li>의 내가 angular.element 및 모든 물건 CSS 스타일을 적용 부모 <div>을 ...이

나는 내부 제어 변수를 채우기 위해 JSON을 좀 $http 통화를 할이 ngClick을 클릭하고받을 때 문제입니다. 그래서 컨트롤러와 지시어에 관한 공통점이없는 다른 메뉴를 클릭 할 때 다른 목록을 채우고 사용자가이 목록을 클릭하면 지시문 인 앞서 말한 <li>의 스타일을 지정해야합니다.

그래서 directive에서 link 참조를 말하는 방법을 모르겠다. 나는 그것을 전달하는 법을 모르는 몇 가지 속성으로 스타일을 지정해야한다. 나는 컨트롤러에서 지시어로 전달할 정보를 저장하는 서비스를 사용한다고 생각했지만 Angular를 처음 사용하고 무엇을해야할지 확신이 서지 않습니다. 나는 많은 것을 수색했으나 정확히 내가 무엇을 찾고 있는지를 찾지 못했습니다. $watch을 사용하는 것을 생각했지만 컨트롤러에있는 변수를 볼 수있는 변수가 있으므로 2 시간 전에 부모 범위로 가야합니다.

고맙습니다.

Answer 1

<div ng-controller="Ctrl as ctrl" ng-style="ctrl.style"> 
    <my-dir on-fetch="ctrl.style = $style"></my-dir> 
</div> 

module.directive('myDir', function(){ 
    return { 
     restrict: 'E', 
     template: '<li ng-click="$ctrl.fetch()"></li>', 
     controller: function(){ 
      var $ctrl = this; 
      this.fetch = function(){ 
       api.fetch().then(function(stylesFromResponse){ 
        $ctrl.onFetch({$style: stylesFromResponse}); 
       }); 
      }; 
     }, 
     bindToController: true, 
     controllerAs: '$ctrl', 
     scope: { 
      onFetch: '&' 
     } 
    }; 
});