Как установить по умолчанию для ng2-select

https://valor-software.com/ng2-select/ на нескольких вкладках показывает использование элемента [data]. Это неверно в соответствии с ридми проекта.

Замените [data] на [initData], и предварительное заполнение будет работать, если данные правильно отформатированы.

ты должен использовать

<ng-select [active]="[periods[0]]" [data]="periods"></ng-select>

Это работает для меня:

<ng-select #my-select [multiple]="true" [items]="dataList"></ng-select>

Импортируйте следующие классы:

import { ViewChild } from '@angular/core';
import { SelectComponent, SelectItem } from 'ng2-select';

В классе компонента получите доступ к компоненту my-select с помощью декоратора @ViewChild:

@ViewChild('my-select') mySelectComponent: SelectComponent;

Погружение в исходный код ng2-select намекает, что свойство active на SelectComponent содержит выбранные значения. Кроме того, active - это массив объектов SelectItem. Таким образом, создание SelectItem объектов и их перемещение в массив active должно позволить вам программно добавлять / удалять выбранные элементы.

Переходя к вашему вопросу, давайте установим несколько значений по умолчанию для ng2-select:

ngOnInit() {
    if(!this.mySelectComponent.active) {
        this.mySelectComponent.active = new Array<SelectItem>();
    }
    this.mySelectComponent.active.push(new SelectItem("Apple"));
    this.mySelectComponent.active.push(new SelectItem("Banana"));
}

Вы также можете очистить все существующие значения:

reset() {
    if(this.mySelectComponent.active) {
        this.mySelectComponent.active.length = 0;
    }
}

Примечание. Конструктор SelectItem принимает в качестве параметра строку или объект. Если вы передадите строку, id и text будут установлены на строковое значение. Если вы хотите передать разные значения для id и text, вы можете сделать это:

this.mySelectComponent.active.push(new SelectItem({id:'apl', text:'Apple'}));

Документы текущей версии объяснены лучше: ng2-select / valor-software.com

Сторона просмотра (category-edit.component.html):

<ng-select [multiple]="true" [items]="tags" [active]="active_tags"></ng-select>

Независимо от того, есть ли один или несколько элементов, всегда должен содержать формат массива, Пример: [{id: 1, text: MyText}] или [{id: 1, text: MyText1}, {id: 2, текст: MyText2}]

Сторона компонента (category-edit.component.ts):

import {Component, OnInit, Injectable} from '@angular/core';

@Injectable()
export class MyService {

   getTagsByCategoryId(id: string): Observable<any> { /** callback */}
}

export interface SelectOption{
   id?: string;
   text?: string;
}

@Component({
  selector: 'app-category-edit',
  templateUrl: 'category-edit.component.html'     
});

export class CategoriesComponent extends OnInit{
   tags: SelectOption[]; /** Assumed you already loaded these */ 
   active_tags: SelectOption[];     

 constructor(private myService:MyService){
   super();
 }
 ngOnInit(){
   this.init();
 }

 init(){

   const id= "the_id"; /** Some valid id to query */
   /** Callback */
   this.myService
       .getTagsByCategoryId(id)(
          response=> {
            if(response.error){ console.error(response.error);}   
            }else{
               console.log(response.result;)
               this.active_tags= <SelectOption[]> response.result;
            }  
          },
          error => {console.error(error);}
     );
 }

}