Question

我正在使用Angular Bootstrap，实际上我正在尝试使用模态正确更新我的模型。

这是非常简单的代码：

控制器：

function open(room) {
  var roomModal = $uibModal.open({
    templateUrl: 'room-modal.html',
    controller: 'RoomModalController',
    controllerAs: 'modal',
    resolve: {
      room: room
    }
  });

  roomModal.result.then(function (response) {
    RoomsService.update({
      roomId: response._id
    }, response).$promise (etc...);
  });
}

模态控制器：

    var vm = this;

    vm.room = room;

    vm.save = function () {
      $uibModalInstance.close(vm.room);
    };

    vm.cancel = function () {
      $uibModalInstance.dismiss('cancel');
    };

基本上我正在解析房间以获取有关它的一些信息，然后如果需要，我希望更新模式中有关房间的一些信息。

它工作正常，除非我不想更新某些信息，我点击“关闭”。

发生的事情是：如果我更新了一些信息，然后点击“关闭”，数据库上的信息尚未更新（确定），但已在主视图中更新...因为Angular将模态信息绑定到主要观点......

这很奇怪，因为我将这些信息传递到一个单独的范围（vm），除非我没有点击保存，否则我不应该期待这种行为......

我在这里做错了什么？！？

Answer 1

在RoomModalController深层复制room对象，以防止在更新时更新模型。

vm.room = angular.copy(room);

现在，此对象将处理模式绑定，并且在更改为根范围vm.room对象时不会发生干扰。

要最终保存此数据，您必须将vm.root模态对象保存到数据库，并根据模式中所做的更改更新根范围vm.room对象。

Angular Bootstrap模态绑定问题

1 个答案: