javascript - AngularJS:数组之间的数据绑定(bind)

Question

给定一个数组 sourceArray 我想创建一个 targetArray，它依赖于第一个数组的条目。这意味着创建的数组应包含每个源条目的条目，并在 sourceArray 更改时更新。但是，修改 targetArray 永远不会更新源。

这Plunker只要 sourceArray 是静态的，就可以正常工作。一旦您开始修改源条目，它显然不会正确更新目标，因为我缺少适当的数据绑定(bind)机制。

我是否需要通过观察 sourceArray 手动更新 targetArray 或者 Angular 是否实现了任何一种单向数据绑定(bind)机制，我可以使用它来保留两个数组同步？

Answer 1

正如 Pritam 所说。你应该使用 $watch。但必须将 Collection 绑定(bind)到它，才能使其工作。在 watch 内部合并数组。

找到这个工作示例:

$scope.$watchCollection(angular.bind(this, function () {
    return this.sourceArray;}), function (newVal, oldVal) {

      var arr = [];
      for(var i in vm.sourceArray){
         var shared = false;
         for (var j in vm.targetArray)
             if (vm.targetArray[j].id == vm.sourceArray[i].id) {
                 shared = true;
                 break; 
             }
         if(!shared) arr.push(vm.sourceArray[i])
      }
      console.log(arr);
      vm.targetArray = vm.targetArray.concat(arr);
    },true);

http://plnkr.co/edit/E2inRLtwfWnb1VBymNNl?p=preview