2

在输入搜索参数之前，“selected”属性中必须设置一个值。谁能帮我解决这个问题？#ember-power-select

它通过在 js 中为“destination”设置一个值并将“destination”分配给“selected”来进行正常的动作处理。在此处查看此类示例http://www.ember-power-select.com/docs/action-handling。

但不能为 custom-serach-action http://www.ember-power-select.com/docs/custom-search-action赋值。

我的代码：

楷模：

  • hpqualifcation.js

    import DS from 'ember-data';
  export default DS.Model.extend({
  type_name: DS.attr('string'),
  hoprofile: DS.belongsTo('hoprofile')
});

  • hoprofile.js

    import DS from 'ember-data';
export default DS.Model.extend({
  name: DS.attr('string'),
  hpqualification: DS.hasMany('hpqualification')
});

路线：

import Ember from 'ember';

export default Ember.Route.extend({
  model: function(params){
    return Ember.RSVP.hash({
      hpqualifications: this.store.query('hpqualification', {username: params.username}),
      …
   });
  }
})

API端的数据：

{
  "hpqualification": [
    {
        "id": 1,
        "type_name": "UG",
        "hoprofile": 1
    },
    {
        "id": 1,
        "type_name": "PG",
        "hoprofile": 2
    }
  ],
  "hoprofile": [
    {
        "id": 1,
        "name": "silicon guy",
        "hpqualifications": [1]
    },
    {
        "id": 2,
        "name": "power star",
        "hpqualifications": [2]
    }
  ]
}

模板：

使用了 ember-power-select custom-search-action，请求将被发送到 API 端以输入每个字母，返回的数据将显示在选择框选项 http://www.ember-power-select.com/文档/自定义搜索操作

{{#each model.hpqualifications as |hpqualification|}}
  {{#power-select
    selected=hpqualification.hoprofile.name
    search=(action "hoProfile")
    onchange=(action (mut hpqualification.hoprofile.name))
    as |repo|
  }}
    {{repo.name}}
     {{/power-select}}
    {{/each}}
  {{/power-select}}
{{/each}}

成分：

import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    hoProfile(term){
      if (Ember.isBlank(term)) { return []; }

      const url = `//localhost:3000/betaweb/filters/hoprofiles?  name=${term}`;
      return Ember.$.ajax({ url }).then(json => json.hoprofiles);
    }
  }
});

为电源选择操作返回的数据：

{
  "hoprofiles": [{
    "id": 7,
    "name": "silicon guy"
  }, {
    "id": 14,
    "name": "power star"
  }]
}

一切正常。但是在 ember-power-select 中，未选择预选值。在输入搜索参数之前选择框是空白的。通常使用下面的代码值是可见的

{{#each model.hpqualifications as |hpqualification|}}
 <label>HO Profile Name<label>
 <li> {{input value=hpqualification.hoprofile.name}} </li>
{{/each}}

它显示从 API 端返回的所有数据。

HO Profile Name
- silicon guy
- power star

但是当我使用 ember-power-select 时，数据没有在选择框中预先选择。我尝试了很多方法，但并没有解决我的问题。谁能给我一个解决方案或使用 power-select 的替代方法？

4

1 回答 1

1

对于预填充的数据，您还需要指定 options 属性。从文档：

“您可以同时提供选项和搜索操作。这些选项将是初始选项集，但一旦用户执行搜索，就会显示该搜索的结果。”

只需确保您传递给选项的列表的格式也与搜索结果相同，换句话说就是具有“名称”属性的对象数组。

至于预选对象，您选择的属性也需要是具有“名称”属性的对象。在你的情况下selected=hpqualification.hoprofile。

于 2016-06-06T06:38:46.623 回答