Question

这是一个通用架构问题。因此，请考虑MVC模型，其中包含数据的模型与某些UI字段相关联，因此它们会同时更新。

现在我需要存储与该UI字段关联的一些UI状态，例如指示字段是否处于编辑模式的标志。 UI将根据此编辑标志进行更新，例如，当编辑标志为真时，它将显示一些编辑控件。

因此，我会更好地重用数据模型并将状态存储在其他后端相关数据中（我肯定不会将此标志发送回后端，因为后端不关心UI状态），或创建一个新容器跟踪UI状态？

Answer 1

在ui表单/模型变脏之后（用户首先开始与表单的第一次交互），你会将模型的状态（自然是ui）存储在一个对象中，让我们称它为“bag”。当用户修改值时，您可以继续更新包。在用户尝试离开表单（关闭窗口，在浏览器中来回等）之前，您可以将此包保存到cookie（如果它很小）或者将帖子保存到服务器并将其保存为json对象包含4个字段的表，如id，jsondata，modelUiIdentifier，userIdentifier。稍后当稍后加载该页面时，您可以获取此数据（如果该模型/ ui和用户存在）并保存模型对象（这将自动更新您的UI）。

如果您正在使用angularjs，只需通过复制其数据（$ scope对象中的非“函数”值并发送到服务器，如上所述）来遍历相关ui部分的$ scope对象。

Answer 2

状态是数据，数据是状态。考虑到这一点，如果您需要存储与UI字段关联的一些UI状态，请使用工厂来创建Object。更改该Object，即可更改UI状态。此外，工厂可以通过简单的注入，跨不同状态管理状态，并且易于测试，在您的项目中重复使用。

<强>更新

管理数据/状态http://plnkr.co/edit/PdDmUz?p=preview

的服务的简单演示

html的

<h3>Controller 1</h3>
  Check me, to check both: 
  <input type="checkbox" ng-model="selected.data" />
  <pre>selected.data: {{selected.data}}</pre>


<h3>Controller 2</h3>
  <div ng-controller="MainCtrl2">
  Or, check me: 
  <input type="checkbox" ng-model="selected2.data" />
  <pre>selected2.data: {{selected2.data}}</pre>

的.js

app.controller('MainCtrl', function($scope,uiFieldState) {
    $scope.selected = uiFieldState.uiObject;
})

app.controller('MainCtrl2', function($scope,uiFieldState) {
    $scope.selected2 = uiFieldState.uiObject;
})

app.factory('uiFieldState', function () {
    return {uiObject: {data: null} };
});

将UI状态直接存储在数据模型中是否有用？

2 个答案: