将服务器（c#/Razor）值传递到 AngularJS 应用程序的最佳方式

Question

我们使用 DNN，并且经常需要将一些特定于上下文的值（如页面 id 或 module-on-page-id）传递到 AngularJS 应用程序中。我们已经制定了自己的惯例来做到这一点，但想听听其他人如何解决这个问题以找到最佳实践。

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

1. 使用像href="@Tab.TabId/{{...}}"这样的in-view-razor（我不喜欢这个）
2. 将值放在 ng-init 中，例如 ng-init="config = { prop1: '@Tab.TabId' }"
3. 创建一个单独的<script> 标签，我们会在其中动态生成一个包含这些值的模块，所以angular.module("config", []).constant('prop1', '@Tab.TabId')
4. 在页面某处创建一个带有razor 的json，并使用与#3 相同的通用代码将其作为模块注入应用程序，只是代码重用更清晰。

这些我都看过，也都用过。目前我们避免使用#1，因为我们认为混合模板语言不好，因为它不允许外部化视图的一部分。所以基本上我们使用#2 作为快速简单（有点脏）+#3/#4 用于大型项目。

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

Answer 1

我们正在使用变体 #4。

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

Answer 2

我们使用 NewtonSoft 并执行 JSONConvert.SerializeObject(ObjectName)，然后将其作为 Session 从控制器传递，然后使用 @Html.Raw(ObjectName) 及其可以在 javascript 中轻松使用的 JSON 对象...