敲除和MVC-使用模板编辑器与渲染的对照结合

发布于 2024-12-04 07:26:20 字数 486 浏览 0 评论 0原文

我只是在研究 Knockout JS 以及如何将它与我正在构建的 MVC3 项目集成。

查看从服务器获取数据的示例，在页面呈现后，淘汰视图模型 (KVM) 始终由 Ajax 调用填充。

这是正常的做事方式吗？

我的页面当前使用模板化编辑器模板呈现控件，例如：

@Html.DropDownListFor(m => m.Holiday.Destination, SelectListHelpers.ToSelectList(Model.HolidayModel.Destinations, Model.Holiday.Destination), new { @class = "optionselect", data_bind = "value: Destination" })

但是，如果使用 Knockout，我不应该将组成选择列表的数据输出为脚本块中的数组，然后使用淘汰赛绑定来填充选择列表？

感谢您对此的任何建议。

原文

I'm just looking at Knockout JS and how I could integrate it with an MVC3 project I'm building.

Looking at the examples where data is brought down from the server, the knockout view model (KVM) is always populated by an Ajax call after the page has been rendered.

Is this the normal way of doing things?

My page currently renders controls using templated editor templates, eg:

@Html.DropDownListFor(m => m.Holiday.Destination, SelectListHelpers.ToSelectList(Model.HolidayModel.Destinations, Model.Holiday.Destination), new { @class = "optionselect", data_bind = "value: Destination" })

However, if using Knockout, shouldn't I be outputting the data that makes up the select list as an array within a script block and then using the knockout binding to fill the select list?

Thanks for any advice on this.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

仙女山的月亮 2024-12-11 07:26:20

执行此操作的一种常见且简单的方法是将模型值序列化到页面。这将类似于：

var viewModel = {
  choices: ko.observableArray(@Html.Raw(Json.Encode(Options))),
  selectedChoices: ko.observableArray(@Html.Raw(Json.Encode(SelectedOptions)))
};

然后，只需在您的选择上使用标准数据绑定，例如：

data-bind =“options：choices，selectedOptions：selectedChoices”

A common and easy way to do this is to serialize your model values to the page. This would be something like:

var viewModel = {
  choices: ko.observableArray(@Html.Raw(Json.Encode(Options))),
  selectedChoices: ko.observableArray(@Html.Raw(Json.Encode(SelectedOptions)))
};

Then, just use a standard data-bind on your select like:

data-bind="options: choices, selectedOptions: selectedChoices"

回复收藏 0 原文

~没有更多了~