ngx-formly ng-select formcontrol изменить выданное значение

Question

У меня есть формальная форма с настраиваемым полем ввода с использованием множественного выбора ng-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);
        }
      }
    }

Answer 1

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

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

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

export class KupTypeaheadComponent {
  defaultOptions: {
    parsers: [(value) => ...],
  }
}