#ember-power-select, Как установить предварительно выбранное значение в действии пользовательского поиска ember-power-select

Question

Перед вводом в параметре поиска должно быть задано значение в атрибуте "selected". Может кто-нибудь помочь мне разобраться? # Ember-power-select

Он работает с обычной обработкой действий, устанавливая значение "destination" в js и назначая "destination" "selected". Посмотрите здесь на такие примеры http://www.ember-power-select.com/docs/action-handling.

Но нельзя назначить значение для пользовательского действия serach 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, где запрос будет отправляться стороне 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?

Answer 1

Для предварительно заполненных данных вам также необходимо указать свойство options. Из документов:

"Вы можете предоставить как параметры, так и действие поиска. Эти параметры будут исходным набором параметров, но как только пользователь выполнит поиск, результаты этого поиска будут отображены вместо этого".

Просто убедитесь, что список, который вы передаете опциям, также отформатирован так же, как и результаты поиска, другими словами, массив объектов с атрибутом "name".

Что касается предварительно выбранного объекта, то выбранное свойство также должно быть объектом с атрибутом "name". В твоем случае selected=hpqualification.hoprofile,