Knockout映射插件无法获取绑定属性

时间:2014-01-03 14:20:49

标签: asp.net-mvc knockout.js knockout-mapping-plugin

我正在尝试将淘汰赛与淘汰赛映射插件结合使用。

我有一个asp.net MVC应用程序返回一个模型(一组客户)。

我的控制器:

Public ActionResult Index()
{
    List<Customer> customers = new List<Customer>{
         .....initializing-code for the customerlist

         };
    return View(customers);
}

在我的视图中我有一个脚本如下:

<script type="text/javascript">
    function ViewModel() {
        var self = this;
    };

    var myViewModel;

    $(function() {
        var jsonModel = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model, new Newtonsoft.Json.Converters.IsoDateTimeConverter()))';
        myViewModel = ko.mapping.fromJSON(jsonModel, {}, new ViewModel());
        ko.applyBindings(myViewModel);
    });

</script>

我想使用foreach进行控制流绑定......这个foreach绑定的变量名是什么。我试过'$ data',但这似乎不起作用。

亲切的问候

相关观点代码:

<div class="row" data-bind="foreach: customers">
    <div class="col-md-2">
    <span data-bind="text: Name"></span>
</div>
<div class="col-md-2">
    <span data-bind="text: FirstName"></span>&nbsp;<span data-bind="text: LastName"></span>
</div>
<div class="col-md-2">
    <span data-bind="text: ContactStreet"></span>&nbsp;<span data-bind="text: ContactBuildingNumber"></span>
</div>
<div class="col-md-2">
    <span data-bind="text: ContactPostalCode"></span>
</div>
<div class="col-md-2">
    <span data-bind="text: ContactCity"></span>
</div>
<div class="col-md-2">
    <button class="btn btn-success">Edit</button>
    <button class="btn btn-danger">Delete</button>
</div>

@section scripts{
@Scripts.Render("~/bundles/knockout")
<script type="text/javascript">
    function ViewModel() {
        var self = this;


    };

    var myViewModel = {};

    $(function() {
        var jsonModel = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model, new Newtonsoft.Json.Converters.IsoDateTimeConverter()))';
        myViewModel.customers = ko.mapping.fromJSON(jsonModel, {}, new ViewModel());
        ko.applyBindings(myViewModel);
    });

</script>

1 个答案:

答案 0 :(得分:0)

如你所愿,你可以像这样绑定它

<div data-bind="foreach: $root">
    <span data-bind="text: Name"></span> 
    ... etc ...
</div>

但是,我会这样做

var myViewModel = {};

$(function() {
    var jsonModel = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model, new Newtonsoft.Json.Converters.IsoDateTimeConverter()))';
    myViewModel.customers = ko.mapping.fromJS(jsonModel);
    ko.applyBindings(myViewModel);
});

然后你可以加入你的标记

<div data-bind="foreach: customers">
    <span data-bind="text: Name"></span> 
    ... etc ...
</div>

因为现在您可以向viewmodel添加更多属性,您肯定需要这些属性。

更新Here's a working jsfiddle。请记住,呼叫是fromJS,而不是fromJSON