KnockOutJS绑定问题

本文关键字：问题 绑定 KnockOutJS | 更新日期: 2023-09-27 18:25:48

我使用的是MVC4、jquery2.03和knockout2.30，无法查看依赖项总数。我是不是遗漏了什么？

型号

namespace eManager.Domain
{
    public class Dependent
    {
        public virtual int Id { get; set; }
        public virtual string Name { get; set; }
        public virtual int Age { get; set; }
    }
}

查看

@model IEnumerable<eManager.Domain.Dependent>
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
<p>Total: <span data-bind="text: dependent().length">&nbsp;</span> dependents(s)</p>

<script type="text/javascript">
    var initialData = @Html.Raw(Json.Encode(Model));
    var viewModel = {
        dependent: ko.observableArray(initialData)
    };
    $(document).ready(function () { ko.applyBindings(viewModel); });
</script>

KnockOutJS绑定问题

正如您从这个jsFiddle中看到的，您的敲除绑定很好：http://jsfiddle.net/pdavis68/k9rG9/

这意味着问题与您的initialData有关。在脚本中放入Razor语法很可能是个问题。您可以向控制器添加一个方法，该方法将数据作为字符串返回，然后使用$.getJSON()调用来检索数据，然后填充视图模型（这就是我们的代码的操作方式）。

对于你的控制器，你可以有这样的东西：

[HttpGet]
public string GetDependents()
{
    Dependent[] dependents = GetAllDependents();
    return new JavaScriptSerializer().Serialize(dependents);
}

然后在您的Javascript中，类似于：

$.getJSON("http://mysite.com/controller/GetDependents", function(data) {  
     $.each(data, function(key, val) {
         viewModel.dependent.push(val);
     });
});

（这完全是我的想法，所以注意可能准确无误，但应该会让你接近）。

在我的控制器中添加了以下

    [HttpGet]
    public string GetDependents()
    {
        var dependents = _db.Dependents;
        return new JavaScriptSerializer().Serialize(dependents);
    }

查看

@model IEnumerable<eManager.Domain.Dependent>
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
<p>Total: <span data-bind="text: dependent().length">&nbsp;</span> dependent(s)</p>

<script type="text/javascript">
    $.getJSON("http://localhost:1233/Dependent/GetDependents", function (data) {
        $.each(data, function (key, val) {
            viewModel.dependent.push(val);
        });
    });
    $(document).ready(function () { ko.applyBindings(viewModel); });
</script>

当我打电话的时候http://abc.xyz/Dependent/GetDependents我得到以下回复[｛"RelationshipManager"：｛｝，"Id"：1，"Name"："Tall Hat"，"Age"：10｝，｛"RelationshipManager"：{｝

但它仍然没有显示计数

相关文章：