以角度更新整个模型对象答案

【问题标题】：Updating entire model object in angular以角度更新整个模型对象
【发布时间】：2016-04-08 18:25:11
【问题描述】：

我有一个名为 eventData 的对象，它是一个通过解析注入多个控制器的单例。

eventData 包含视图数据（如下拉列表值）以及我的模型。基本上是这样的：

eventData.DropDownListValues1
eventData.DropDownListValues2
eventData.MyModel

然后在我的每个控制器中我都有这个：

angular.module('myWebApp.controllers').
    controller('MyCtrl', function ($scope, eventData, coreAPIservice, ViewMatrixService, UtilityService) {

        $scope.myModel = eventData.MyModel;
        $scope.dropDownListValues1 = eventData.DropDownListValues1;
});

我的观点是这样的：

<select class="form-control input-sm"
        ng-model="myModel.Item"
        ng-options="myItem as myItem.ItemName for myItem in dropDownList1 track by myItem.ItemId">
    <option value="" selected disabled hidden>Select Item...</option>
</select>

发布后，我的网络服务返回更新后的模型，该模型现在包含由数据库生成的 ID。我尝试重新分配 eventData.MyModel，但它不会导致所有引用 MyModel 的控制器更新。

coreAPIservice.UpdateEvent(eventData.MyModel).success(function (response) {
    eventData.MyModel = response;
});

通常当我像这样从任何控制器更新模型的属性时：

$scope.myModel.myProperty1 = "abcdefg";

该属性更改会立即反映在所有引用 eventData.MyModel 的控制器/视图中。

我的猜测是，因为我要替换整个 MyModel 对象，所以引用正在丢失，因此视图不会更新。

我能想到的唯一选择是在发布后重新获取数据或单独更新每个属性。

我不喜欢重新获取，因为它是多余的。我已经从帖子中获得了更新的模型。添加另一个 fetch 只会减慢速度，相当于刷新页面。

我不喜欢单独更新每个属性，因为 MyModel 上有超过 1000 个属性，并且编码需要一段时间并且性能不是很好。

【问题讨论】：

你有多少控制器需要这个？您可以注册一个手表（角度事件）并在新对象发生时触发一个事件。事件处理程序（控制器上的方法）然后将接收对新对象的引用。如果您还有 1000 个控制器，这可能不起作用，最好创建一个更通用的方法来执行此操作。
可以直接用eventData试试吗？ $scope.myEventData = 事件数据；然后使用 ng-model = myEventData.MyModel.Whatever...
@Igor 我有 7 个控制器
@ZivWeissman 是的，这可以工作，因为你仍然有对 eventData 的引用。我还发现我可以在监听器中使用广播并重新分配 MyModel。您认为您的建议会运行得更快吗？
我相信使用我的建议会更快，因为您无需重新分配，也无需广播。你保留旧的参考。

标签： javascript angularjs

【解决方案1】：

像这样改变你的控制器构造函数代码：

$scope.eventData= eventData;
Object.defineProperty($scope, "myModel", { get: function () { return $scope.eventData.MyModel; } });
Object.defineProperty($scope, "dropDownListValues1", { get: function () { return $scope.eventData.DropDownListValues1; } });

这样做是将 myModel 注册为 $scope 上的属性（而不是字段）。然后，该属性总是在引用时从 eventData 检索 MyModel 对象。这将允许您保持现有的 HTML 不变。它还允许您更新 EventData 实例上的整个模型，而无需推送事件。您的控制器将具有对 EventData 的引用（作为字段），但您不必引用它，但在创建的 getter 属性中除外。

您可能想仔细检查我的 JavaScript 语法，我是从 here 获得的

【讨论】：