问题
I am relatively new to both Ember.js and Ember-cli and would really appreciate some help please with using a jquery tooltip in a custom view. All code is below, but when my template is injected, I get the following console error:
[Error] TypeError: 'undefined' is not a function (evaluating 'Ember.$().tooltip()')
I am using a custom view in a file called 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'});
}
});
The relevant template code is:
{{#view "tooltip" titleBinding="item" placement="right"}}<span><img class="app_info_icon" id="typeInfoIcon" src="/assets/images/info_icon.png"></img></span>{{/view}}
How can I fix this please?
回答1:
Solved as follows:
- Jquery's widgets etc. are not included in the standard jquery
library which ember-cli uses. It has to be added using
bower install --save jquery-ui
- You then have to add the following lines to Brocfile.js:
app.import('bower_components/jquery-ui/jquery-ui.js');
app.import('bower_components/jquery-ui/ui/tooltip.js');
- As @Leeft pointed out, when referencing jQuery from a view or
component
this.$()
should be used, notEmber.$()
- Be sure to use a version of Ember-CLI after 0.40.
回答2:
There are some issues in the code but just regarding error, Its coz you need to import the tooltip
library(js file) into ember-cli. It is done in brocfile.js before calling app.toTree()
like below
app.import('vendor/tooltip.js');
Follow the link for more details. http://www.ember-cli.com/#managing-dependencies
回答3:
Try ember-cli tool-tipster
.....works great.
来源:https://stackoverflow.com/questions/25424562/using-jquery-in-ember-cli