单击计数器使用Knockout不起作用

时间:2013-09-11 08:59:48

标签: knockout.js knockout-mvc

这次我正在创建一个使用Knockout和MVC的点击计数器。我从Knockout官方网站http://knockoutmvc.com/ClickCounter看到了这个例子,但它没有按预期工作,有人可以帮助我,并告诉我在哪里犯错误,以便它可以在我的系统上运行。这是我的应用程序的代码。

模特课程:

using PerpetuumSoft.Knockout;
using PerpetuumSoft;
using DelegateDecompiler;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;

namespace MvcApplication20.Models
{
 public class Class1
 {

    public string Buyer { get; set; }
    public string Car { get; set; }
    public string Price { get; set; }
    public int NumberOfClicks { get; set; }

    [Computed]
    public bool HasClickedTooManyTimes
    {
        get { return NumberOfClicks >= 3; }
    }

    public void RegisterClick()
    {
        NumberOfClicks++;
    }

    public void ResetClicks()
    {
        NumberOfClicks = 0;
    }
  }
}

控制器类:

using System.Web.Mvc;
using MvcApplication20.Models;
using PerpetuumSoft.Knockout;

namespace MvcApplication20.Controllers
{
 public class HomeController : Controller
{

    public ActionResult Index()
    {
        return View(new Class1());
    }
    public ActionResult RegisterClick(Class1 model)
    {
        model.RegisterClick();
        return Json(model);
    }
    public ActionResult ResetClicks(Class1 model)
    {
        model.ResetClicks();
        return Json(model);
    }
  }
}

查看课程

<script src="~/Scripts/knockout-2.3.0.js"></script>
<script src="~/Scripts/knockout.mapping-latest.js"></script>

@using PerpetuumSoft.Knockout
@model MvcApplication20.Models.Class1
@{
  var ko = Html.CreateKnockoutContext();
 }
<div>You've clicked <span @ko.Bind.Text(m => m.NumberOfClicks)></span> times</div>
<button @ko.Bind.Click("RegisterClick", "Home").Disable(m => m.HasClickedTooManyTimes)>Click me</button>

<div @ko.Bind.Visible(m => m.HasClickedTooManyTimes)>
That's too many clicks! Please stop before you wear out your fingers.
 @ko.Html.Button("Reset clicks", "ResetClicks", "Home")  
</div>
@ko.Apply(Model)

请检查代码并告诉我更改或错误的位置,以便它可以运行。

0 个答案:

没有答案