asp.net-mvc - angularjs 和 ASP.NET MVC : best strategy for clientside models

Question

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

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

使用例如从服务器检索一个 View 模型web api，包含 View 模型所需的所有数据

将客户端 View 模型渲染到服务器端 html 中的 javascript

使用多个 Web api 调用检索 View 模型的数据，例如，一个用于要编辑的主要数据，一个用于每个附加数据(选择列表)

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

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

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

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

Answer 1

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

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

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