angular - ngx-select-dropdown 设置具有多个值的 displayKey

Question

我正在使用ngx-select-dropdown搜索功能，我想设置多个displayKey值，例如：firstname和lastname.

下面是我的config对象：

dropdownconfig = {
    displayKey: 'firstName, lastName',
    search: true,
    placeholder: 'Select User',
    height: '150px'
};

html:

<ngx-select-dropdown (change)="selecteAdmin($event)" [config]="dropdownconfig" [options]="allUserData" [(ngModel)]="singleSelect" [multiple]="false" ></ngx-select-dropdown>

如何显示多个值displayKey？此外，需要对该下拉菜单进行验证。

标签： angulartypescriptdropdownboxngx-select-dropdown

Answer 1

在您的数组对象中创建自定义字段。并将其用作密钥。

dropdownconfig = {
    displayKey: "custom",
    search: true,
    placeholder: "Select User",
    height: "150px"
  };


  allUserData = [
    { firstName: 'first1', lastName: 'last1'}, 
    { firstName: 'first2', lastName: 'last2'},
    { firstName: 'first3', lastName: 'last3'},
    { firstName: 'first4', lastName: 'last4'}
  ]

  ngOnInit() {
    for (let user of this.allUserData) {
      user['custom'] = user.firstName + ' ' + user.lastName;
    }
  }

工作堆栈闪电战