3

为了快速回归测试,我正在寻找一种方法来确保所有 KendoUI 内容都已正确配置和初始化。

当我无法检测到模型上确实不存在值绑定路径的情况时,我会遇到问题,即在以下示例中:

  • 源绑定到不存在的属性data-bind="source: AnotherNonExistingProp"会引发错误Uncaught TypeError: Cannot read property 'parent' of undefined(所以我可以在控制台中检测到它)
  • 但是,值绑定到存在的属性data-bind='value: Details.NonExistingProp'不会引发任何错误 - 因此我无法确保我的观点中没有回归。

HTML:

    <form>
    <div>
        <label>Name<label>
        <input data-bind='value: Name' type='text' />
    </div>
    <div>
        <label>Age<label>
        <input data-bind='value: Details.NonExistingProp' type='text' />
    </div>
        <table border='1px' data-template="row-template" data-bind="source: anotherNonExistingProp">
        </table>
    </form>

JavaScript:

<script type='text/javascript'>
    $(function () {    
    var carModel = kendo.observable({
        Name: 'CarName',
        Details: {
            Age: 25
        },
        Parts: [{PartName:'aa'},
               {PartName:'bb'}]
    });
        kendo.bind($('form'), carModel);    
    })
</script>

有没有办法检测值绑定使用不存在的路径时的情况(即,当路径所针对的属性未定义时)?

这是一个现场 jsFiddle示例

4

2 回答 2

3

您始终可以绑定到可观察对象上的更改事件并检查对象的属性...

viewModel.bind("change", function(e) {
  if (this[e.field] === undefined) {
    console.error("The field " + e.field + " cannot be bound because it doesn't exist");
  }
});

如果你想一次获得所有的 observables,你可以获取根 observable 对象并快速绑定到变化。

免责声明: MVVM 是一台经过微调的机器。如果您拦截它的功能并像这样进行检查,您可能会减慢它的速度。这也不是 Kendo UI 团队正式支持的东西。您的里程可能会有所不同。

kendo.observable = function(object) {
  if (!(object instanceof kendo.data.ObservableObject)) {
    object = new kendo.data.ObservableObject(object);
    // add a get binding on all observables
    object.bind("get", function(e) {
      if (this[e.field] === undefined) {
        console.error("Cannot bind to the field '" + e.field + "' because it does not exist");
      }
    });
  }

  return object;
};

http://jsbin.com/amOSejUy/1/edit

于 2014-01-24T14:56:45.140 回答
2

我在上面的代码(@Burke Holland)上使用了一些细微的变化来处理嵌套对象:

    kendo.observable = function (object) {
        if (!(object instanceof kendo.data.ObservableObject)) {
            object = new kendo.data.ObservableObject(object);
            // add a get binding on all observables
            object.bind("get", function (e) {
                var splitFields = e.field.split('.');
                var nestObj = this;
                for (var i = 0; i < splitFields.length; i++) {
                    nestObj = nestObj[splitFields[i]];        
                }
                if (nestObj === undefined) {
                    console.error("Cannot bind to the field '" + e.field + "' because it does not exist");
                }
            });
        }

        return object;
    };
于 2014-01-27T16:24:31.413 回答