javascript - 将服务器(c#/Razor)值传递到 AngularJS 应用程序的最佳方法

Question

我们使用 DNN，经常需要将一些上下文特定值(例如页面 id 或模块页面 ID)传递到 AngularJS 应用程序中。我们已经制定了自己的惯例来执行此操作，但希望听取其他人的意见，他们如何解决此问题以找到最佳实践。

所以基本上情况是服务器页面有 JS 所需的信息。使用 WebAPI 不是一种选择，因为这些值在页面中已知，但在单独的请求中不已知。到目前为止我所看到的事情是:

1. 使用 View 内 Razor ，如 href="@Tab.TabId/{{...}}" (我不喜欢这个)
2. 将值放入 ng-init 中，例如 ng-init="config = { prop1: '@Tab.TabId' }"
3. 创建单独的 <script>标记，我们在其中动态生成包含这些值的模块，因此 angular.module("config", []).constant('prop1', '@Tab.TabId')
4. 在页面中的某处使用 razor 创建一个 json，并使用通用代码将其全部作为模块注入(inject)到应用程序中，该代码的作用与 #3 相同，只是重用了更干净的代码。

这些我都看过，也都用过。目前我们避免使用#1，因为我们认为混合模板语言不好，而且它不允许将 View 的某些部分外部化。所以基本上我们使用#2 来实现快速简单(并且有点脏)+#3/#4 来实现更大的项目。

您有更好的方法，或者您更喜欢哪种方法？

Answer 1

我们正在使用变体#4。

这样做的优点是 JSON 定义了 JS 模块所需配置的确切接口(interface)。 Razor 非常适合使用 @Url.Action 生成 URL。