ngx-formly ng-select formcontrol изменить выбранное значение - PullRequest
0 голосов
/ 25 февраля 2020

У меня есть форма с настраиваемым полем typeahead с помощью ng-select multi select. В настоящее время он генерирует массив пар ключ-значение. Мне нужно, чтобы испустить массив только значений. Похоже, это должно быть довольно простой задачей, но я изо всех сил пытаюсь ее решить. Буду публиковать обновления, поскольку я пробую разные вещи. Я могу создать помощника для перехвата модели и ее переформатирования, но должен быть чистый способ сделать это в formcontrol.

typeahead.component.ts

@Component({
  selector: 'app-kup-typeahead',
  template: `
    <ng-select
      [items]="options$ | async"
      [ngClass]="{'ng-select-required': to.required}"
      [placeholder]="to.label"
      [typeahead]="search$"
      [formControl]="formControl"
      [multiple]="to.multiple"
      (change)="onChange($event)"
    >
    </ng-select>
  `,
})
export class KupTypeaheadComponent extends FieldType implements OnInit, OnDestroy {
  onDestroy$ = new Subject<void>();
  search$ = new EventEmitter();
  options$;

  ngOnInit() {
    this.options$ = this.search$.pipe(
      takeUntil(this.onDestroy$),
      startWith(''),
      filter(v => v !== null),
      debounceTime(200),
      distinctUntilChanged(),
      switchMap(this.to.search$),
    );

    this.options$.subscribe();
  }

  ngOnDestroy() {
    this.onDestroy$.complete();
  }

  onChange(item: any) {
    console.warn('onChange ', item);
  }
}

form-config.ts

   {
      key: 'genotype.ploidy',
      id: 'filter_ploidy',
      type: 'kup-typehead',
      templateOptions: {
        label: 'Filter by Ploidy',
        multiple: true,
        options: of(res['creation_method']),
        search$: (term: string) => {
          return this.dropdownService.getDropdown('genotypes/ploidies', '', '', term);
        }
      }
    }

1 Ответ

0 голосов
/ 26 февраля 2020

Я думаю, что это должно быть как-то сделано ng-select, попробуйте передать bindValue ввод (проверьте их do c). С формальной стороны, мы полагаемся на formControl, чтобы контролировать испускаемое значение, решение состоит в том, чтобы удалить [formControl]="formControl" ввод и полагаться на событие onChange, но это не рекомендуется:

  onChange(item: any) {
    this.formControl.setValue(item);
  }

другой способ - использовать parsers:

export class KupTypeaheadComponent {
  defaultOptions: {
    parsers: [(value) => ...],
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...