0

得到了一个可以正常工作的组件，如下所示（肯定设置了selectedId）：

export default Ember.Component.extend({
    store: Ember.inject.service(),
    items: [],
    selectedId: 0,
    result: '',
    init () {
        this._super(...arguments);
        var store = this.get('store'); 
        let items =  store.findAll('dealtype');
        this.set('items', items);
    },
    didInsertElement: function() {
       // this.$().select2();
     }
});

这使我的组件很好，但是对于 if 语句它永远不会变为 true 的部分（为此安装了 ember-truth-helpers）

<select style="width:100%">
    <option value=""></option>
    {{#each items as |item|}}
        {{#if (eq selectedId item.id)}}
            <option selected="selected" value="{{item.id}}">{{item.name}} YEAH</option>
        {{else}}
            <option  value="{{item.id}}"> {{item.name}} </option>
        {{/if}}
    {{/each}}
</select>

不想混淆问题，但正如您所见，我注释掉了 select2 init 调用。这样做时，它使我选择了一个 select2 列表，但是这些项目消失了（仍然在标记中）

4

1 回答 1

1

我肯定会建议您使用 Ember Power 选择组件，因为它们已经解决了您需要选择组件的所有问题

http://www.ember-power-select.com/

它们有两个组件用于单选条目和多个。ember cli 项目有很好的文档和强大的支持

https://github.com/cibernox/ember-power-select

至于你的问题，我会试试这个 - 我还没有测试过它，但是从我的头顶来看，这应该可以解决你的问题：

import Ember from 'ember';

export default Ember.Component.extend({
  didInsertElement : function(){
  this._super();
  Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
},
afterRenderEvent : function(){
var component = this;
Ember.run.later((function() {
  Ember.$('select').select2({
    minimumInputLength: 2,
    delay: 250}).on('select2-open', function() {}
  })
});

因此，您需要使用 aaferRenderEvent 并稍后运行以初始化您的 select 2 组件。如果所有 {} 都正确关闭，请检查以上代码。但这将使您的 select2 工作 insdie ember 项目。

希望能帮助到你。

于 2016-06-25T13:43:50.777 回答