mardi 21 avril 2020

Does ember-power-select has a feature that mark as selected when a user input text that is not on the record?

I have a scenario where a user can input text and when he press Enter key it will tagged as selected. Question, how will I show the input text that should show as selected when I press Enter? Example: I typed Miguel and press enter it should show as one of the selected records

Addon: https://ember-power-select.com/docs/multiple-selection

enter image description here

/template.hbs

<PowerSelectMultiple
  @searchEnabled=true
  @options=
  @selected=
  @onInput=
  @onKeydown=
  @placeholder="Select some names..."
  @onChange= as |name|>
  
</PowerSelectMultiple>

/component.js

import Controller from '@ember/controller';
import { action } from "@ember/object";
import { tracked } from "@glimmer/tracking";

export default class extends Controller {
  @tracked
  fooBarBazList = [];

  @tracked
  fooBarBazSelectedFromInput = "";

  names = ['Stefan', 'Mike', 'Tomster', 'Pluto'];

  @action
  foo(value) {
    this.fooBarBazSelectedFromInput = value;
  }

  @action
  baz(value, event) {
    if(event.key === 'Enter') {
      let list = this.fooBarBazList;
      let selected = this.fooBarBazSelectedFromInput;
      list.pushObject(selected);
    }
  }
}



Aucun commentaire:

Enregistrer un commentaire