0

所以我有一个问题......我在我的网络应用程序中分离关注点：剃须刀页面中的 HTML 和 js 文件中的 JS。我的问题在于我想使用来自服务器的视图模型中传递的控制器中的数据作为选择列表的选项。问题在于我已将我的 js 与我的 HTML 分开，并且我无法访问 js 文件中的 Razor。

我的视图模型中有一个项目列表...

public List Stuffs { get; set; }

我在服务器端对其进行 json 编码，并确保处理循环引用，所以它看起来像这样 [{"id":1,"name":"blah"},{"id":2,"name":"blah2"},{"id":3,"name":"blah3"},{"id":4,"name":"blah4"}]

问题是，我想保持关注点分离，那么如何将该数组放入我的 js 文件中，以便可以使用敲除将其绑定到选择列表？我绝对不想再次往返服务器。

4

2 回答 2

2

因此，假设您有一些看起来像这样的视图：

<div> (Some stuff) </div>

<script type="text/javascript">
    var initialData = //Your JSON
<script>

然后在您的 javascript（您已在视图下方链接，以便它在其后加载）中，您有如下内容：

var data = initialData || {} //Or some other default value, in case initialData wasn't set

如果设置了，这将加载initialData，或者如果没有设置，则不使用任何内容（或您定义的默认值）。松耦合。

当然，更复杂的数据将需要您对结构进行标准化，但这本质上是一种方法，允许您从剃刀生成的视图中提取数据，而无需将其紧密耦合到您的 javascript 文件。

于 2012-08-01T20:48:26.100 回答
1

您的 Javascript 文件是否包含可实例化函数形式的视图模型，例如：

function MasterVM(data)

或对象文字，例如

var masterVM = { ...

? 我倾向于使用可实例化的视图模型（部分原因是它们使用映射插件通过视图模型的层次结构向下链接——顶层构建它的子视图），在这种情况下，我认为 Razor 视图实例化视图很好具有从 MVC 视图模型呈现的 JSON 的模型，例如：

var masterVM = new MasterVM(@(Html.Raw(JsonConvert.SerializeObject(Model.ProductViewModel))));

或者甚至让 Knockout 视图模型由一个显示模块“拥有”并像这样初始化它：

productModule.init(@(Html.Raw(JsonConvert.SerializeObject(Model.ProductViewModel))));

然后 productModule 还负责其他事情，例如在您的视图模型和服务器之间进行调解，监视脏状态等。

此外，如果您正在采购大量希望浏览器缓存的可重用选项，那么再次往返服务器并不一定是坏事。如果你是，你可能想要一个 MVC 控制器，它发出一个包含所有常用选项的大对象文字，然后你可以将其用作跨多个选择的“选项”属性。但是，如果您的选项特定于特定的视图模型，那么我想它们必须是您的视图模型的一部分。

于 2012-08-02T06:36:12.250 回答