Question

在这个JsFiddle中：http://jsfiddle.net/maxl/mCXND/

（从http://jsfiddle.net/ud3323/XMgwV/复制和修改）

我尝试基于JQuery创建一个Ember DatePicker。

我遇到的第一个问题是这一行：

var ui = jQuery.ui[this.get('uiType')](options, this.get('element'));

jQuery.ui [this.get（'uiType'）]没有返回一个函数，所以我想这个解决方案我开始使用一些jQueryUI小部件，但不是全部。我想要一个适用于所有JQuery-UI小部件的解决方案，特别是JQueryUI的Datepicker。

由于

Answer 1

如果查看jqueryui代码，您会看到其中一些被调用为函数，而其他函数则没有。您可以使用以下方法解决它：

var ui;
if (typeof jQuery.ui[this.get('uiType')] === 'function') {
   ui = jQuery.ui[this.get('uiType')](options, this.get('element'));
} else {
   ui = this.$()[this.get('uiType')](options);
}

工作示例：http://jsfiddle.net/PzsrT/7/

Answer 2

关于jQuery UI的datepicker小部件作为EmberJS Mixin还有一件事。如果要提供回调函数来处理beforeShowDay事件，则会引发此错误：

Uncaught TypeError: Cannot read property '0' of undefined

即使你的回调函数（在你的ember视图中）返回一个数组，就像它在jqueryui doc中指定的那样

  beforeShowDay: function(date){
    some code...
    return [true, ''];
  };

这是因为_gatherEvents函数中的callback.call之后没有返回任何内容

  _gatherEvents: function(options) {
    var uiEvents = this.get('uiEvents') || [], self = this;

    uiEvents.forEach(function(event) {
      var callback = self[event];

      if (callback) {
        // You can register a handler for a jQuery UI event by passing
        // it in along with the creation options. Update the options hash
        // to include any event callbacks.
        options[event] = function(event, ui) { callback.call(self, event, ui); };
      }
    });
  }

我通过在callback.call之前添加一个return语句来解决这个问题。

_gatherEvents: function(options) {
    var uiEvents = this.get('uiEvents') || [], self = this;

    uiEvents.forEach(function(event) {
      var callback = self[event];

      if (callback) {
        // You can register a handler for a jQuery UI event by passing
        // it in along with the creation options. Update the options hash
        // to include any event callbacks.
        options[event] = function(event, ui) { return callback.call(self, event, ui); };
      }
    });
  }

工作示例http://jsfiddle.net/thibault/qf3Yu/

将JQuery UI的datepicker小部件作为EmberJS Mixin工作

2 个答案: