angularjs - 버튼을 클릭하여 다른 요소의 내용을 변경하십시오.

Question

질문 제목이 모호하지만 기본적으로 버튼 요소가 있으므로 그 버튼을 클릭하고 다른 요소를 변경하려고합니다. 아무도 내게 무엇을 놓치고 있는지에 대한 아이디어를주지 못하거나이를 달성하는 방법에 대한 명확한 예를 들어 줄 수 있습니까? 아래

번호 :

가

HTML :

가

<div ng-controller="buttonController"> 
    <button ng-click="fadeIt()">click to fade</button> 
    <div class="redbox" my-directive my-two-way-binding="twoWay">fade me</div> 
</div> 

컨트롤러 :

가

function buttonController($scope){ 
    $scope.twoWay = false; 

    $scope.fadeIt = function(){ 
     $scope.twoWay = !$scope.twoWay; 
     console.log("inside fadeIt function $scope.twoWay is: " + $scope.twoWay); 
    } 
} 

지정 :

app.directive("myDirective", function(){ 
    return{ 
     restrict:"A", 
     scope: { 
      twoWayBind: "=myTwoWayBinding" 
     }, 
     link:function(scope, element, attrs){ 
      //console.log("directive - twoWayBind is: " + scope.twoWayBind);  
      scope.$watch(scope.twoWayBind, function(newVal){ 
       console.log('inside directive ' + scope.twoWayBind);  
      }); 
     } 
    }; 
}); 

Answer 1

scope.$watch('twoWayBind'

scope.$watch(scope.twoWayBind이 때문에이어야 $ watch는 실제 모델이 아닌 범위의 속성을 참조하는 문자열을 허용합니다. 그 외에는 당신이 올바른 생각을 가지고 있다고 생각합니다. 내 의견으로는 조금 청소기입니다

<div class="redbox" my-directive="twoWay"> 

:

또한, 청결을 위해, 당신은

scope:{ 
    twoWayBind: "=myDirective" 
} 

다음에 템플릿 코드를 단축 할 수 만들었을 수도.