Question

我正在使用angular6 multi-select，它具有从ngOnInit上的角度服务进入对象数组的项目列表，像这样传递到multi-select中：

this.sensorTypes = [
  { label : "Power", value : "P"},
  { label : "Current", value : "C"},
  { label : "Voltage", value : "V"}
]

我要在表单加载时在multi-select中默认设置2个值。为此，我在ngModel上绑定了multi-select，在该变量中，我在ngOnInit上设置了值

this.selectedAttributes = [
  {label : "Current", value : "C"},
  {label : "Voltage", value : "V"}
]

在我的component.html中，我正在这样创建multi-select：

<div class="form-group row">
  <div class="col-sm-10">
    <ng-select 
       [ngClass]="'ng-select'" 
       [(ngModel)]="selectedAttributes" 
       [ngModelOptions]="{standalone: true}" 
       [options]="sensorTypes"
       [multiple]="true">
    </ng-select>
  </div>
</div>

但是默认情况下，多项选择中未设置值。

Answer 1

如果同时使用bindlabel和bindvalue，则首先查找选定值t的索引 e

var index= this.sensorTypes.findIndex(x => x.ID ==something); 
//this will set value
this.selectedAttributes= this.sensorTypes[index].ID;

Answer 2

您应该使用import { React, Component } from "./react.js";输入绑定而不是[items]

[options]

然后在组件的module.ts上，导入<ng-select [items]="sensorTypes" bindLabel="label" [multiple]="true" placeholder="Select" [(ngModel)]="selectedAttributes"> </ng-select>。而且，如果您尚未导入NgSelectModule，则应该这样做，因为需要导入它才能与FormsModule进行2种方式绑定。

ngModel

Answer 3

默认情况下，多项选择中未设置值

为此，将this.sensorTypes[0]分配给ng-select中ngOnInit()的ngModel

ngOnInit() {
  this.selectedAttributes = this.sensorTypes[0]
}

这将获得第一个属性作为默认属性。

如何在angular6中的ng-select中设置默认值？

3 个答案: