set selected value in angular5 ng-select programmaticaly


I’m using angular5 ng-select component:
and try to set the selected value (programatically) when the container component first loaded (kind of default selected value set in the model).
I didn’t find any relevant attribute for it or for the isSelected for each item.
Here is my code (filtered):

<ng-select [items]="filter.values"  bindLabel="text" bindValue="id" class="input-md" [(ngModel)]="filter.selectedValue"></ng-select>


export class FilterData
    Name : string;
    FormattedName : string;
    values : Filter[];
    selectedValue : Filter = null;
    constructor(filterData : FilterData)
        this.Name = filterData.Name;
        this.values = filterData.values;
        this.selectedValue = typeof filterData.selectedValue == "undefined" ? null : filterData.selectedValue;

export class Filter 
    public id: number;
    public text: string;


Just find the item

    let item = this.ngSelect.itemsList.findByLabel('label of the item');

and then set it back;

you need a reference to ng-select in your angular component

    ngSelect: NgSelectComponent;

Answered By – Juan M. Carballo

Answer Checked By – Timothy Miller (AngularFixing Admin)

Leave a Reply

Your email address will not be published.