控制器作用域对象的更改未反映在指令$watch回调中

Question

我有一个控制器，它的作用域上有一个对象：$scope.objToTrack。我在嵌套视图中有一个指令，$监视该对象的更改
它具有隔离范围，但objToTrack被设置为=，以便可以监视它。

当我单击指令时，它会调用一个表达式，该表达式是控制器上更改objToTrack的方法。

这里有一个plunker来说明我的设置。

问题是objToTrack$watch回调没有被触发，尽管对象已经更改
如果在Test1和Test2状态之间切换，则对objToTrack所做的更改是可见的。只是我不明白为什么点击后它就不起作用。

谢谢。

Answer 1

要回答问题。。。如果您将自己的事件处理程序绑定到一个元素，并在该事件处理程序中更改angular范围，则需要调用$apply，以便angular知道更改并可以运行摘要

示例：

element.on('click',function(){
       scope.onClick({number:RNG.int(200,300)});
});

需要更改为：

element.on('click',function(){
    scope.$apply(function(){
        scope.onClick({number:RNG.int(200,300)});
     });
});

如果使用angular已经提供的事件指令，则会简单得多。在这种情况下，与使用ng-click相比，您正在编写大量的额外代码。当您尽可能多地保持在角度内时，它也使测试变得更容易

Answer 2

此外，如果要将对象传递到指令中，则不应使用大括号。在html中，使用obj-to-track="objToTrack"，而不是obj-to-track="{{objToTrack}}"。像这样：

<div simple-directive obj-to-track="objToTrack" class="directive"></div>

在directional.js中：使用'='进行objToTrack的双向绑定。像这样：

scope:{
  objToTrack:'='
}

Answer 3

在"test*.html"文件中，将"on click"替换为"ng click"。

"on click"不会出现在当前控制器中，"ng click"会出现。