双向绑定在此示例中不起作用

Question

我是 Angularjs 的新手。有人可以帮助找出其中的问题吗？双绑定在此示例中不起作用。

<body ng-app="animateApp">
  <br/> the watch is triggered only on the load of the page, not on subsequent changes to the property "acts"
  <div ng-controller="tst">
    <input type="button" bn="" acts="acts" value="Add Action" /> {{acts.crop}}
  </div>
</body>

var animateAppModule = angular.module('animateApp', [])

animateAppModule.controller('tst', function($scope) {
  $scope.acts = {
    crop: "test"
  };
  $scope.$watchCollection('model.acts', function(newValue, oldValue) {
    alert("as");
  })
})

animateAppModule.directive('bn', function() {
  return {
    restrict: "A",
    scope: {
      acts: '='
    },
    link: function($scope, iElement, iAttrs) {
      alert("l");
      iElement.click(function() {
        alert($scope.acts.crop);
        $scope.acts = {
          crop: "real"
        };
        alert($scope.acts.crop);
      })
    }
  }
})

Answer 1

首先你必须像这样编写手表功能：

$scope.$watch('acts', function(newValue, oldValue) {
  alert("as");
});

现在您已经设置了从指令更改范围后应用：

$scope.$apply();

检查更新的 jsFiddle：http://jsfiddle.net/gM2Hg/121/

希望对您有所帮助。谢谢

双向绑定在此示例中不起作用

The two way binding is not working in this example

angularjs

angular-directive