Question

我对Ember.js和Ember-cli都比较陌生，非常感谢在自定义视图中使用jquery工具提示的一些帮助。所有代码都在下面，但是当我的模板被注入时，我收到以下控制台错误：

[Error] TypeError: 'undefined' is not a function (evaluating 'Ember.$().tooltip()')

我在名为tooltip.js的文件中使用自定义视图：

import Ember from 'ember';

export default Ember.View.extend({

  tagName:  'span',
  title:  'The tooltip title',
  html: true,
  placement:  'top',
  didInsertElement: function(){
    Ember.$().tooltip({"html": this.get('html'),  
                                        "title":this.get('title'),
                                        "placement":this.get('placement'), 
                                        container: 'body'});

  }
});

相关的模板代码是：

{{#view "tooltip" titleBinding="item" placement="right"}}<span><img class="app_info_icon" id="typeInfoIcon" src="/assets/images/info_icon.png"></img></span>{{/view}}

我该如何解决这个问题？

Answer 1

解决如下：

Jquery的小部件等不包含在标准jquery中 ember-cli使用的库。必须使用bower install --save jquery-ui
然后，您必须将以下行添加到Brocfile.js：

app.import('bower_components/jquery-ui/jquery-ui.js'); app.import('bower_components/jquery-ui/ui/tooltip.js');

正如@Leeft指出的那样，从视图或引用jQuery时应使用组件this.$()，而不是Ember.$()
请务必在0.40之后使用Ember-CLI版本。

Answer 2

代码中存在一些问题但只是关于错误，因此需要将tooltip库（js文件）导入到ember-cli中。它在调用app.toTree()之前在brocfile.js中完成，如下所示

app.import('vendor/tooltip.js');

点击链接了解更多详情。 http://www.ember-cli.com/#managing-dependencies

Answer 3

尝试ember-cli tool-tipster .....效果很好。

在Ember-cli中使用jquery

3 个答案: