javascript - 置き換え時に角モデルが更新されない

Question

この Plunkrは、私が問題を抱えていることを示しています。

ダイアログとその親ページの両方に表示される配列があります。ダイアログの範囲内でその配列を変更しても問題なく動作しますが、配列を完全に置き換えると、変更はダイアログの範囲内でのみ表示されます。何故ですか？

Plunkrがそれを食べる場合に備えて、私のコード：

angular.module('app', ['ui.bootstrap'])
  .controller('demoController', function($modal) {
    var vm = this;

    vm.message = 'Binding Problems';
    vm.list = [1,2,3];

    vm.modal = function() {
      $modal.open({
        controller: 'modalController as vm',
        templateUrl: 'modal.html',
        resolve: {
          list: function() {
            return vm.list;
          }
        }
      });
    };
  })
  .controller('modalController', ['$modalInstance', '$scope', 'list',
    function($modalInstance, $scope, list) {
      var vm = this;

      vm.list = list;
      vm.modalText = 'Modal Text';

      vm.cancel = function() {
        $modalInstance.dismiss();
      };
      vm.clear = function() {
        vm.list = []; // This does not propagate to the parent controller...
      };

      vm.add = function() {
        vm.list.push(4); // ...but this does.
      };

    }
  ]);

更新: Plunkr が更新されたので、現在何が起こっているかは理解できますが、コードで修正する方法はわかりません。私の実際のコードでは、データを AJAX 呼び出しの結果に置き換えています。この場合、 AJAX 呼び出しから返された各アイテムvm.list.length = 0をing するなど、いくつかのオプションがあると思いますが、それは恐ろしく非効率的です。push()これは通常どのように行われますか?