9

我目前正在研究客户端模型绑定到 HTML 模板，尤其是使用 angularjs。我想知道从服务器检索客户端视图模型的最佳策略是什么，例如，视图模型不仅包含要编辑的数据，还包含选择列表或下拉列表等的数据。

在我看来，一个人有几个选择

  1. 使用例如 web api 从服务器检索一个视图模型，其中包含视图模型所需的所有数据
  2. 将客户端视图模型呈现为服务器端 html 中的 javascript
  3. 使用多个 web api 调用检索视图模型的数据，例如，一个用于要编辑的主要数据，一个用于每个附加数据（选择列表）

我没有遇到很多选项 1 的示例，因为似乎 web api 主要用于返回一种类型对象的特定数据的 crud 操作，例如 Person 或 Order

选项 2 符合使用 asp.net mvc 的服务器端视图模型的实践，但我没有看到很多将这种技术与 angularjs 结合使用的示例

如果考虑分离关注点，选项 3 看起来很干净，但具有多个较小的 ajax 请求的缺点。

你能分享你的想法和经验吗？

4

2 回答 2

2

就个人而言，我使用选项#3。该应用程序将请求“准备编辑器”，例如填充下拉列表，并请求获取您要编辑的数据（或者，如果您正在创建一个新对象，则为任何默认初始值）。我认为这比选项＃1更好地分离了关注点，选项＃1将“模型”数据和“支持”数据联系在一起。

但是正如您所指出的，这确实会产生额外的调用，并且如果它们非常多，可能会显着减慢页面速度。（或增加复杂性；在具有许多依赖字段的大表单上，排序可能变得很重要）。

我通常做的是让服务器提供“组合”api（例如/editor/prepare-all），同时还提供小块（例如/editor/prepare-dropdown-1，/editor/prepare-dropdown-2）。当您的编辑器加载时，您使用组合的；如果字段之间存在依赖关系，您可以只请求依赖字段的数据（例如/editor/prepare-dropdown-2?dropdown1-value=123）。我相信这对服务器的复杂性影响不大。

于 2013-04-22T07:21:27.223 回答
1

我会同意圣。从来没有并且肯定使用过选项#3，我认为结合 $resource 和 Web API 将是一个完美的 RAD 组合。但是，我也曾在非常复杂的屏幕上工作过，我需要亚秒级的响应时间，所以我采取了优化整个开发“列”的方法——我使用 SQL Server 作为后端数据库进行开发，所以我使用了它对 XML 的本机支持从存储过程返回结构化 XML，然后我将其序列化为 .Net 模型 (POCO)，然后将其传递给 Json 序列化器以传输到浏览器。我可能需要针对 POCO 执行一些额外的业务处理，但这仍然会导致非常简单的代码结构来传输相当复杂的数据结构。通常它也非常快，因为我

于 2013-04-22T10:35:52.027 回答