javascript - Angular JS 不更新嵌套对象的 View

Question

我正在使用优秀的 AngularJS Rails Resources对于一个对象——它依次具有深层嵌套对象——当我更新它的一些属性时，更新的属性不会显示在模板上，直到我重新加载页面。

让我们从头开始:这是我的目标:

    var invoice = Invoice.get($stateParams.invoiceId).then(function (result) {
      $scope.invoice = result;
    });

下面是我如何打开模式来编辑值:

$scope.openEdit = function (edit) {
  $scope.editModal = $modal.open({
    templateUrl: 'editModalContent.html',
    controller: 'InvoiceShowController',
    size: 'lg'
  });
  $scope.editModal.result.then(function(select) {
  });
};

$scope.cancel = function () {
  $scope.$close();
};

$scope.ok = function () {
  $scope.invoice.update().then(function (result) {
    $scope.cancel();
    console.log(result);
  });
};

在我看来，我有以下几点:

...
<li>{{invoice.trading_details.trading_name}}</li>
<li>{{invoice.trading_details.trading_address_1}}</li>
...

在模态正文中，我有以下内容:

    ...
    <div class="form-group">
      <label for="exampleInputEmail1">Trading Name</label>
      <input ng-model="invoice.trading_details.trading_name" type="text" class="form-control" id="exampleInputEmail1">
    </div>
    <div class="form-group">
      <label for="exampleInputEmail1">Trading Address Line 2</label>
      <input ng-model="invoice.trading_details.trading_address_1" type="text" class="form-control" id="exampleInputEmail1">
    </div>
    ...

因此，当我在模式中编辑属性并控制对象时，更改就在那里。当我保存并取回结果时，更改就在那里，但无论出于何种原因， View 都没有更新。

有什么想法吗？

编辑:我的整个 controller

Answer 1

您似乎缺少 resolve 设置。它将数据传递给您的模式。

$scope.openEdit = function (edit) {
   $scope.editModal = $modal.open({
      templateUrl: 'editModalContent.html',
      controller: 'InvoiceShowController',
      size: 'lg',
      //notice a function is returning the data
      resolve: {
         invoice: function(){
             return  $scope.invoice;
         }
      }
  });
 };

编辑链接到 Plunker:http://plnkr.co/edit/IJvdBJrJngsNYaG39Gfh?p=preview

注意 resolve 如何创建传递到 editCtrl 的实例 invoice。

更新你也可以这样做

   $scope.editModal = $modal.open({
      templateUrl: 'editModalContent.html',
      controller: 'InvoiceShowController',
      size: 'lg',
      //notice a function is returning the data
      resolve: {
         invoice: function(){
             return  Invoice.get($stateParams.invoiceId);
         }
      }
  });

...因为 resolve 可以处理一个 promise。