在路过MVC模式KnockoutJS最佳实践 [英] Best practice on passing Mvc Model to KnockoutJS

问题描述

我GOOGLE了围绕如何通过MVC模式knockoutjs，似乎有两种方式：

I googled around on how to pass mvc model to knockoutjs and it seems there are two ways:

• 使用@ Html.Raw（Json.En code（型号））


• 使用$不用彷徨或$阿贾克斯

其中的方法之一是通过MVC模式knockoutjs的最佳实践？我知道这是一个按规定的基础，但它似乎使用$不用彷徨更清洁兑@ Html.Raw方法。

Which of the ways is a best practice of passing mvc model to knockoutjs? I know it is a per requirement basis but it seems using $.get is more cleaner versus the @Html.Raw method.

推荐答案

我已经成功地使用了几种方法。

I've successfully used several approaches.

在一个强类型的Razor视图，你可以像你将任何其他HTML，插入模型元素，当您去编写JavaScript视图模型对象。我觉得这klunky如剃刀和JS不与Visual Studio和智能感知以及一起玩，但即使有一串红squigglies产生的code正常工作。

In a strongly typed Razor view, you can write the JavaScript ViewModel object like you would any other HTML, inserting the Model elements as you go. I find this klunky as Razor and JS don't play well together with Visual Studio and Intellisense, but even with a bunch of red squigglies the resulting code works fine.

<script type="text/javascript">

var data = [
    @for (int i=0; i < Model.Packages.Count; i++)
    {
        var package = Model.Packages[i];
        <text>{Id: ko.observable(package.Id),
               Name: ko.observable(package.Name)
              }</text>
    }

    var viewModel = {
        var packages = ko.observableArray(data);
        // more code
    }

    ko.applyBindings(viewModel);
</script>

这code能在匆忙取决于模型的复杂性变得丑陋。正如你所说，你也可以使用Html.Raw序列化模型对象为JSON（）。如果你走这条路线，你可以用它来建立一个使用KO映射库中的淘汰赛视图模型：

This code can get ugly in a hurry depending on the complexity of your Model. As you mentioned, you can also serialize the model object into JSON using Html.Raw(). If you go that route, you can use it to build your Knockout ViewModel using the KO Mapping library:

<script type="text/javascript">
    var data = @Html.Raw(new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(Model));
    var viewModel = ko.mapping.fromJS(data);
    ko.applyBindings(viewModel);
</script>

这是不是第一个选项是缺憾，但我觉得我放弃了太多的控制权这种方式。这意味着我的KO视图模型是紧耦合的我MVC视图模型的结构，我可能会或可能不希望pretty。更何况，这个工作我的JavaScript需要在我的网页CSHTML，我真的不喜欢。最后，这两种方法是纯粹的服务器端。为了更加适应网页，就像个SPI，你需要做更多的客户端。

This isn't as kludgy as the first option, but I feel like I'm giving up too much control this way. It means my KO ViewModel is pretty tightly coupled to the structure of my MVC ViewModel, which I may or may not want. Not to mention, for this to work my JavaScript needs to be in my cshtml page which I really don't like. Lastly, both of these approaches are purely server side. For more responsive web pages, like SPIs, you'll want to do more on the client side.

我的preference是使用$ .getJSON从自身的JavaScript调用客户端。在这一点上，可以处理该返回数据到视图模型，无论是手轧制或使用映射库。如果要调用返回到你的MVC控制器动作，只是动作返回一个JsonResult类型（而不是一个ActionResult）。 （你也可以做类似的东西与ContentResult类型）如果你可以使用新的MVC4的WebAPI，这些控制器将默认返回JSON。

My preference is to use $.getJSON calls client side from the JavaScript itself. At that point, you can process the return data into your ViewModel, either hand rolling or using the mapping library. If you are calling back to actions in your MVC controller, just have the action return a JsonResult type (instead of an ActionResult). (You can also do similar stuff with ContentResult) If you can use the new MVC4 WebAPI, those controllers will return JSON by default.

这篇关于在路过MVC模式KnockoutJS最佳实践的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！