canjs - 每当将匹配选择器的元素添加到控件元素时，如何将事件绑定到 Can.Control 以运行？

Question

我正在尝试构建一个 DateTimePicker 小部件，并且不想担心小部件的实例化，所以我创建了一个 Can.Control，它将 html 正文作为元素。

但是，现在我的输入元素使用 can.view 在 DOM 中呈现。如何将事件绑定到将新的 dateTime 元素插入到我的控制范围？

/**
 * DateTime Plugin
 */

plugins.DateTime = can.Control.extend({

},{
    init : function ( element , options ){
    },

    'input.dateTime click' : function (){
        $( this.element ).find('input.dateTime').datetimepicker();
    }
});
$(function(){
    new plugins.DateTime('body');
});

当元素添加到控制元素时，有什么方法可以指定'input.dateTime load'来绑定日期选择器？

Answer 1

有几种方法可以做到这一点，例如，您的基于 can.view 的渲染可以在完成后执行回调，因此您可以这样做： var that = this; can.view(template, data, function() { that.element.find("input.dateTime").datetimepicker(); }

但这并不是我真正推荐的。前面的示例没有说明由于第一次呈现视图后数据更改而必须重新绘制其中一个字段的任何情况。相反，创建一个这样的助手： Mustache.registerHelper("datetimepicker", function() { return function(el) { $(el).datetimepicker(); } });

然后在您的 (Mu)Stache 文件中：

<input type="text" name="datetime_start" class="dateTime" {{datetimepicker}} can-value="datetime_start">