Как установить значения по умолчанию в ng-select в angular6?

Я использую angular6 multi-select которые имеют список элементов, поступающих в массив объектов из угловой службы на ngOnInit как это, которое переходит в multi-select:

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

Я хочу установить 2 значения по умолчанию в multi-select когда форма загрузится. Для этого я обязуюсь 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>

Но значения не устанавливаются по умолчанию в множественном выборе.

4 ответа

Решение

Вы должны использовать [items] привязка ввода вместо [options]

<ng-select 
  [items]="sensorTypes"
  bindLabel="label"                 
  [multiple]="true"
  placeholder="Select"
  [(ngModel)]="selectedAttributes">
</ng-select>

И в файле module.ts вашего компонента импортируйте NgSelectModule, И если вы не импортировали свой FormsModule, вы должны сделать это, так как он должен быть импортирован для двухстороннего связывания с ngModel работать.

import { NgSelectModule } from '@ng-select/ng-select';
import { FormsModule } from '@angular/forms';
.
.
@NgModule({
  imports: [
    FormsModule,
    NgSelectModule,
. 
.
.

Если вы используете и bindlabel, и bindvalue, сначала найдите индекс выбранного значения te

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

значения не устанавливаются по умолчанию в множественном выборе

для этого назначения this.sensorTypes[0] к модели вашего ng-select в ngOnInit()

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

это получит первый атрибут как атрибут по умолчанию.

Есть два разных модуля ng-select,

'@ ng-select / ng-select' и 'ng-select'

оба тега директивы одинаковы, и [параметры] используются в ng-select и [items] используются в '@ ng-select / ng-select'

Все, что вам нужно, - использовать любой из

Спасибо

Другие вопросы по тегам