带有Knockout和RequireJS的自定义绑定处理程序



在requireJS中使用敲除时,我在应用自定义绑定处理程序时遇到问题。基本上,在过去,我包含了一个全局绑定处理程序js文件,其中包含我所有的自定义绑定。现在我正在使用requireJS来强制执行依赖关系,我不知道如何访问这些自定义绑定。

我曾经用创建全局函数

function KOCustomBindings() {
// Custom Bindings
ko.bindingHandlers.returnKey = {
//handler code
}
}

现在我正在使用require,我觉得我应该有一个定义语句

define(['jquery', 'knockout'],
    function($, ko)){
// Custom Bindings
return KOCustomBindings;
}
});

然而,我不相信绑定会执行,除非特别调用,也许是在填充程序中?有人对此有什么想法吗?

感谢您的帮助,

由于自定义绑定修改ko对象,因此它们只需要加载一次,并且它们的模块不需要返回任何内容。如果你有一个主/入口/应用程序部分作为应用程序的第一步,那么你只需要简单地要求你的自定义绑定和扩展程序。

define(['jquery', 'knockout'], function($, ko)){
    // Custom Bindings
    ko.bindingHandlers.returnKey = { ... }
    //NO return needed
});

然后,在您的启动部分,只需

require('lib/custom-ko-bindings');

一个简单的方法是将自定义绑定定义为AMD模块,并从父视图模型中要求它。示例-

Bindings.js

define(, function () {
    ko.bindingHandlers.Date = {
        update: function (element, valueAccessor) {
            var value = valueAccessor();
            var date = moment(value());
            var strDate = date.format('MM-DD-YYYY');
            $(element).text(strDate);
        }
    };
});

您的视图模型-

define(['jquery', 'knockout', 'bindings'],
    function($, ko, bindings)){
});

这将使DOM中的任何元素都可以访问"Date"的Knockout绑定处理程序。(我的例子是我在moment.js中使用过的例子)

在任何子视图或需要父视图模型的视图中,现在您应该能够使用

<span data-bind="Date: myDate" />

我能够通过在绑定模块中封装敲除并返回修改后的敲除实例来实现这一点。这是我最终得到的配置:

require.config({
  paths: {
    'knockout': 'lib/knockout', // name that's only used once in customBindings.js
    'ko': 'app/customBindings'
  }
  // more config ommitted
});

我的自定义绑定:

define(['knockout'], function (ko) {
    ko.bindingHandlers.returnKey = {
        //handler code
    }
    return ko;
});

我的模块需要敲除,只需要引用"ko"。

require(['jquery', 'ko', 'underscore'], function ($, ko, _) {
    // do knockout-y things! now with bindings!
});

最新更新