$ 적용

Question

내가 가지고있는 DOM에 표시되는 이미지를 제어하는 ​​지시자 :.

summariesApp.directive('changePlus', function() { 
    return function changePlus(scope, element, attr) { 
     if (scope.$parent.Tab == "MultiVariant")    
      if (scope.$parent.multis[parseInt(attr.a)].show) { 
        element[0].src = 'Images/hide.png'; 
       } 
       else { 
        element[0].src = 'Images/show.png'; 
       } 
      } 
      else { 
       element[0].src = 'Images/show.png'; 
      } 

      element.on('mousedown', function (event) { 
       var imgName = event.target.src.split("/"); 
       if (imgName[imgName.length - 1] == 'show.png') { 
        event.target.src = 'Images/hide.png' 
       } 
       else { 
        event.target.src = 'Images/show.png' 
       } 
      }); 
     } 
    }); 

문제는 내가 서비스를 호출 할 때 나는이 지침에 대해 원하는 것입니다 운영. $ scope. $ apply를 사용하고 다이제스트 사이클을 실행하는 것으로 생각하면이 지시어를 평가할 수는 있지만 그렇지 않습니다. $ scope에있는 지시어로 뷰를 재평가 할 수있는 방법이 있습니까? $ apply?

$scope.$watch('myModelProperty', function() { 
     // do something 
    }); 

    $scope.buttonClicked = function() { 
     $scope.myModelProperty = "foo"; // This will trigger $watch expression 
    }; 

그러나 가장 좋은 방법은 당신의 서비스에 지시어의 속성을 결합하는 것입니다.

Answer 1

난 당신이 $ 범위 $ 시계를 찾고 있습니다 생각합니다. 가능하면 $ apply와 $ watch를 사용하지 마십시오. 속성으로

:.

angular.module('myModule', []).directive('myDirective', function() { 
    return { 
    restrict: 'E', 
    scope: { 
     myVar: '=' // two ways data-binding 
    }, 
    link: function(scope, element, attrs, controllers) { 
     scope.myVar //myVar is available in your scope and is bind to your model 
    }, 
    templateUrl: 'my-template.html'// myVar is available in your template and is bind to your model 
    }; 
});