如何使用 Angular 4 Reactive Form 在 PrimeNg MultiSelect 中设置默认选定值？

Answer 1

当您创建

selectedSensorsList

时，您需要为您的

formGroup

提供价值：

 this.addEditWebhookForm = this._formBuilder.group({
     ...,
     selectedSensorsList: [
         defaulSensorsList
     ]
 });

或稍后设置该值：

this._formBuilder.get('selectedSensorsList').setValue(defaultSenorsList);

Answer 2

HTML

您需要在 primeng 组件中设置一个 ngModel

<div class="col-md-4">
          <span translate>settings.account.webhook.label.additional.variables</span>
          <p-multiSelect [options]="sensorsList" (onChange)="changeSensorsList($event)"
                formControlName="selectedSensorsList" name="selectedSensorsList" [panelStyle]="{minWidth:'20em'}"  [(ngModel)]="selectedDefault"></p-multiSelect>
    </div>

TS

selectedDefault= [];
sensorsList.map((item) => selectedDefault.push(item.value));

在这里我选择了所有这些。

您还必须更新传感器列表对象以将所选值更改为 true

Answer 3

你必须在 ngOnInit 中设置默认选项

selectedSensorsList: [{'id': 0, 'itemName': 'lat'}]