Javascript 观察在具有隔离作用域的指令中不触发

我试图用D3和Angular做点什么。我不确定这和D3有什么关系，但我把它放在那里，这样我就可以重现我所尝试的一切

这是一个重复我的问题

---

我试图做的是，创建数据数组并基于该数据生成一组d3 svg圆。创建的指令应“监视”此数据数组，并根据数组收缩或扩展创建或删除更多的圆。。我认为逻辑很容易理解。为了确保以后再这样做，我使用$timeout将一个新值添加到数组中

首先，这个代码：

似乎是错误的，因为您没有在范围内的

obj

上的任何位置定义

dataArray

因此：

function($scope,model,$timeout) {
    $scope.obj = {};
        model.data[0] = 20;
        model.data[1] = 30;
        model.data[2] = 40;
        model.data[3] = 50;

        $timeout(function(){

            model.data.push(Math.random()*100);
            console.log(model.data);
        },1000);
}

应该是这样的：

function($scope,model,$timeout) {
    $scope.model = model;
    $scope.model.data[0] = 20;
    $scope.model.data[1] = 30;
    $scope.model.data[2] = 40;
    $scope.model.data[3] = 50;

    $timeout(function(){
        $scope.model.data.push(Math.random()*100);
        console.log($scope.model.data);
    },1000);
}

scope : {
    data : '&'
},

这个：

应该是

现在，在您的指令中，您设置了如下范围：

function($scope,model,$timeout) {
    $scope.model = model;
    $scope.model.data[0] = 20;
    $scope.model.data[1] = 30;
    $scope.model.data[2] = 40;
    $scope.model.data[3] = 50;

    $timeout(function(){
        $scope.model.data.push(Math.random()*100);
        console.log($scope.model.data);
    },1000);
}

scope : {
    data : '&'
},

但这应该是：

scope : {
    data : '='
},

因为您需要对数据属性表示的对象的引用用于属性包含要执行的表达式时

因此，通过这些更改，指令中的scope.data现在包含对“commonModel”的引用，因此指令不再需要请求“commonModel”。然后将$watch更改为“data.length”上的watch，以了解添加或删除项目的时间

---

类似这样的内容：

太棒了，谢谢。。你刚才提到的一些东西实际上是我不同尝试的“遗物”。我最初只是在控制器中的一个scope对象上尝试了一下，就像在这个plunk中一样，这个dint可以工作，然后我尝试了一个服务（你在那里看到的），甚至没有工作！！我尝试引用该对象（scope.obj.data而不是scope.data），这也很有帮助。看来解决这一问题的方法实际上是监视scope.data.length，而不是监视scope.data。。。我仍然不清楚为什么看长度有效而看物体本身无效！！！也许我应该在deepwatch设置为true的情况下观看。。。好主意。。thanx..您的watch表达式应该尽可能快，因为它们是针对每个摘要执行的，所以如果您只想知道何时添加/删除元素，那么就可以监视data.length。如果在整个数据结构上确实需要一个watch，那么可以将“true”作为第三个参数传递给$watch，这将告诉Angular按值而不是按引用进行监视。但在这样做之前要三思，因为这会带来性能上的损失。