在MVC 3生成淘汰赛标记 [英] Generating Knockout Markup in MVC 3

问题描述

我们正在编写我们的MVC客户端的新的基础设施，我们正在试图使它所以开发商不会需要右键太多的Javascript（目前的发展游泳池主要是基于桌面的）

we are currently writing a new infrastructure for our MVC client and we are trying to make it so the developers will not need to right much Javascript (current development pool are mainly desktop based)

是我到目前为止已经为我们的淘汰赛脚本做的是创建一个basicly生成基于使用反射模型中的所有淘汰赛的东西一个扩展方法..这适用于简单的模型完全正常，没有计算值，因此只要工作相当不错的。

what I've done so far for our knockout scripts is create a Extension method that basicly generates all the knockout stuff based on the model using reflection.. this works perfectly fine for simple models with no computed values and so far as worked quite well.

因此​​，举例来说，假设我们有这个类

so for example, say we had this class

public class AppViewModel
  {
     public string FirstName {get; set;}
     public string LastName {get; set;}
  }

以下，就可以产生并添加到视图

the following would be generated and added to the view

  function AppViewModel() {
    this.firstName = ko.observable('Bob');
    this.lastName = ko.observable('Smith');
   }

什么标识真正喜欢做的是支持计算从模型值..但我只是不能想出一个办法做到这一点。

what Id really like to do is support computed values from the model.. but I just cant figure out a way to do it

所以

    public FullName()
{
return this.FirstName + " " + this.LastNAme
}

将产生类似

 this.fullName = ko.computed(function() {
        return this.firstName() + " " + this.lastName();
    }, this);

因此​​，只要讲清楚 - 我想要做的是基于我的模型生成的计算值

So just to make it clear - what I'm trying to do is generate computed values based on my model.

感谢您的帮助。

欢呼声。
STE。

cheers. ste.

推荐答案

进一步什么帕维尔上面提到的，还有显示为'T'您的方案一个很好的例子：

further to what Pavel mentioned above, there is a great example showing your scenario to a 'T':

http://knockoutmvc.com/HelloWorld

下面是从页面转录：

型号：

public class HelloWorldModel
{
  public string FirstName { get; set; }
  public string LastName { get; set; }

  public Expression<Func<string>> FullName()
  {
    return () => FirstName + " " + LastName;
  }
}

剃刀：

@using PerpetuumSoft.Knockout
@model KnockoutMvcDemo.Models.HelloWorldModel           
@{
  var ko = Html.CreateKnockoutContext();
}
<p>First name: @ko.Html.TextBox(m => m.FirstName)</p>
<p>Last name: @ko.Html.TextBox(m => m.LastName)</p>
<h2>Hello, @ko.Html.Span(m => m.FullName())!</h2>

@ko.Apply(Model)

控制器：

public class HelloWorldController : BaseController
{
  public ActionResult Index()
  {
    InitializeViewBag("Hello world");
    return View(new HelloWorldModel
    {
      FirstName = "Steve",
      LastName = "Sanderson"
    });
  }
}

自动生成的HTML：

<p>
    First name:
    <input data-bind="value : FirstName" /></p>
<p>
    Last name:
    <input data-bind="value : LastName" /></p>
<h2>
    Hello, <span data-bind="text : FullName"></span>!</h2>

<script type="text/javascript">
    var viewModelJs = { "FirstName": "Steve", "LastName": "Sanderson" };
    var viewModel = ko.mapping.fromJS(viewModelJs);
    viewModel.FullName = ko.computed(function () {
        try {
            return this.FirstName() + ' ' + this.LastName();
        } 
        catch (e) { return null; };
    }, viewModel);
    ko.applyBindings(viewModel);
</script>

这篇关于在MVC 3生成淘汰赛标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！