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(scope.twoWayBind应为scope.$watch('twoWayBind'，因为$ watch接受引用范围属性的字符串，而不是实际模型。除此之外，我认为你有正确的想法。

另外，为清洁起见，你本可以做到这一点

scope:{
  twoWayBind: "=myDirective"
}

然后您可以将模板代码缩短为：

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

在我看来有点清洁。

angularjs - 按一下按钮改变另一个元素的内容

1 个答案: