组件中的 Emberjs "eq"

Emberjs "eq" in component

得到一个工作正常的组件,如下所示(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 语句实现的部分(为此安装了 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 初始化调用。这样做时,它使我的 select 成为 select2 列表,但项目消失了(认为仍在标记中)

我肯定会推荐您使用 Ember Power select 组件,因为它们已经解决了您需要 Select 组件

的所有问题

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

它们有两个组成部分,分别用于单个 select 条目和多个条目。 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 独立运行 ember 项目。

希望对您有所帮助。