在ember-cli中安装jQuery插件

Angel VB 发表于 Dev

天使VB

我需要在ember-cli中安装此timePicker。

我在供应商文件夹中添加了库，并在导入了Brocfile.js：

var EmberApp = require('ember-cli/lib/broccoli/ember-app');
var app = new EmberApp();

app.import('vendor/timePicker/jquery-ui-timepicker-addon.js');
app.import('vendor/timePicker/jquery-ui-sliderAccess.js');

module.exports = app.toTree();

我已经创建了components / jquery-ui-timepicker-addon.js：

import Em from "ember";
export default Em.TextField.extend({
  dateFormat:'yy-mm-dd',
  timeFormat: 'HH:mm:ss',
  stepHour: 1,
  stepMinute: 1,
  stepSecond: 1
});

我需要从模板中调用它，但我不知道如何。

我认为代码类似于：

 {{jquery-ui-timepicker-addon}}

但是什么也没发生。

你可以帮帮我吗？

问候。

猕猴桃

您需要在Ember将组件放入DOM时调用jQuery插件。钩子叫做didInsertElement

像这样做：

import Em from "ember";
export default Em.TextField.extend({
  setupTimepicker: function() {
    this.$().timepicker({
      dateFormat:'yy-mm-dd',
      timeFormat: 'HH:mm:ss',
      stepHour: 1,
      stepMinute: 1,
      stepSecond: 1
    )}
  }.on('didInsertElement')
});

的解释this.$()：this引用组件，$()并将元素作为jQuery对象返回。因此，this.$()将组件表示为jQuery对象。一旦拥有元素作为jQuery对象，就可以调用jQuery插件。但是您需要等到Ember将元素添加到DOM之前，才能访问该元素。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。