从 ejs-dropdownlist 中获取选定的项目对象

Question

我正在使用 Syncfusion 的 ejs-dropdownlist，但我很难弄清楚如何在我的 FormBuilder 中获取完整对象，而不仅仅是 value 来自 [fields] 属性

<form [formGroup]="addForm">
<ejs-dropdownlist [dataSource]="data"
                  [fields]="{text: 'title', value: 'id'}"
                  formControlName="name"
                  placeholder="Select name"></ejs-dropdownlist>
</form>

.ts 文件

 public addForm = this.fb.group({
   name: ['', [Validators.required]]
 });

如果我登录 addForm 控件，我会得到 ID，但我希望拥有完整的对象。

console.log(this.addForms.controls.name.value) // '1'

Answer 1

是的，您可以使用 getDataByValue public 方法获取所选值对象的值。

请参考以下代码示例。

   <ejs-dropdownlist #dropdown formControlName="skillname" name="skillname" [dataSource]='sportsData' [fields]='fields'
    [placeholder]='autoreactiveplaceholder' floatLabelType='Auto'>
</ejs-dropdownlist>

<button (click)="getObject($event)">ClickTo get the selected value object</button>

  @ViewChild('dropdown')
  public dropdownObject: DropDownListComponent;

 getObject(args) {
      var fieldObject = this.dropdownObject.getDataByValue(this.skillForm.controls.skillname.value);
      console.log(fieldObject);
    }

我已经根据您的要求创建了一个示例。请在此处找到示例：https://stackblitz.com/edit/angular-u6i8q3?file=app.component.html

要了解有关 public 方法的更多信息，请参阅 API 文档 link：https://ej2.syncfusion.com/angular/documentation/api/drop-down-list#getdatabyvalue

从 ejs-dropdownlist 中获取选定的项目对象

Get selected item object from ejs-dropdownlist

syncfusion

typescript

angular8