Javascript Angular JS scope.watch不工作

我有下面的设置来观察一个元素，并在它改变时做一些事情。此cod在自定义指令中-小提琴在这里：完整示例如下：

  scope.$watch(
    function() {
      return $("#orgChartData").html();
    },
    function(oldval, newval) {
      console.log("Changed!");
    });

  setTimeout(function() {
    $("#orgChartData").append("<li>TEST</li>");
    console.log("TIMEOUT");
  }, 2000);
  setTimeout(function() {
    $("#orgChartData").append("<li>TEST</li>");
    console.log("TIMEOUT");
  }, 4000);
  setTimeout(function() {
    $("#orgChartData").append("<li>TEST</li>");
    console.log("TIMEOUT");
  }, 6000);

scope.$watch(
函数（）{
返回$（“#orgChartData”）.html（）；
},
函数（oldval、newval）{
log（“已更改！”）；
});
setTimeout（函数（）{
$（“#orgChartData”）。追加（“
测试”
”；
控制台日志（“超时”）；
}, 2000);
setTimeout（函数（）{
$（“#orgChartData”）。追加（“
测试”
”；
控制台日志（“超时”）；
}, 4000);
setTimeout（函数（）{
$（“#orgChartData”）。追加（“
测试”
”；
控制台日志（“超时”）；
}, 6000);

我的控制台说：

变了

超时

超时

超时

---

为什么这不起作用

演示中没有手表。为什么不使用angular数据模型来存储数据和渲染视图，而不是使用jQuery？angular是一个特殊的特性。它只会“观察”在其作用域内发生的更改（并且setTimeout会在angular的作用域之外启动您的函数）。您可能需要调用$scope.$apply（）才能使其正常工作。@charlieftl-我刚刚更新了小提琴，现在它的手表版本正确了。我使用JQuery是因为我正在使用的库使用JQuery。我将它包装在一个角度组件中，但它需要一个嵌套的

ul

。@bri-我在一个指令中，这会有所不同吗？