Question

我按照示例here创建自定义绑定。要更新的属性在文档中获得如下：

        var value = valueAccessor();
        value(false);

在我的代码中，表使用knockout foreach绑定绑定到一个对象数组。

 <tbody data-bind="foreach: {data: sites, as: 'site'}">
    <td class="siteid" data-bind="text: site.siteid"></td>
    <td class="expirydate" data-bind="datepicker: site.expirydate"></td>
          et cetera

该表似乎正确填充了数据。价值都在正确的位置。

数组中的对象具有一些字符串属性和几个日期，因此几个表格单元格附加了jQuery UI日期选择器。这是我正在使用的自定义datepicker绑定代码，我在这里找到了SO，虽然我没有参考方便（这是由Niemeyer先生的回复，我记得）。

ko.bindingHandlers.datepicker = {
        init: function (element, valueAccessor, allBindingsAccessor) {
            //initialize datepicker with some optional options
            var options = allBindingsAccessor().datepickerOptions || {},
                $el = $(element);

            $el.datepicker(options);

            //handle the field changing
            ko.utils.registerEventHandler(element, "change", function () {
                var observable = valueAccessor();
                var newVal = $el.datepicker("getDate")
                observable(newVal);
               // a breakpoint is set at this location
            });
          .
          .
          . <snip>

代码在observable(newVal);

上崩溃

但是，如果我改变

var observable = valueAccessor();

到

 var observable = valueAccessor;

然后代码运行没有错误。但是当我在observable之后检查值时，在断点位置，它不包含newVal中的日期值;而是它包含原始日期值。

如果不是observable(newVal)，我会尝试这样做：

     allBindingsAccessor().value(newVal);

我收到错误：“对象不支持属性或方法'value'”。

Answer 1

我的对象数组中对象的各个属性不是可观察的。

因此，当我向站点阵列添加新的站点对象时，我需要这样做：

              var Site = function(siteid, sitename, expirydate) {
                  this.siteid=siteid;
                  this.sitename = ko.observable(sitename);
                  this.expirydate = ko.observable(expirydate);

              }


              function SitesViewModel(){

                  var self=this;
                  self.sites = ko.observableArray([]);

                  self.sites.push( new Site ( ......) );

               }

以便valueAccessor()返回一个可观察的，而不是简单的整数或字符串或日期对象，视情况而定。

Answer 2

是的，它不会在原因未知的情况下遗憾地更新模型。

但是我用不同的方法使事情适合我。

使用CSHTML语法：

<input type="text"  data-bind="value:$data.CompletionDate,datePicker:true " />

我注意到的点数： - 在数据绑定中如果你删除value并尝试保留一些自定义绑定，如下面的模型不会得到更新

<input type="text"  data-bind="formatdate:$data.CompletionDate,datePicker:true " />
enter code here

-instead我尝试使用老式方式保持value完好无损，并添加Datepicker:true whihc服务于我的追求绑定和日期选择。

我的Datepicker绑定处理程序

ko.bindingHandlers.datePicker = {
        init: function (element, valueAccessor) {
            var value = valueAccessor();
            var value = ko.utils.unwrapObservable(valueAccessor()); //ko.unwrap based on version you use 

            if (value && typeof value === 'object') {
                $(element).datepicker(value);
            }
            else {
                $(element).datepicker(/* your default options here */);
            }
        }
}

上述方法可能会或可能不会解决您的问题，但它确实令人愉快。

使用foreach绑定对象数组时更新knockout模型

2 个答案: