How to set an option as disabled on ng-select?-CodePudding

Using ng-select version 12. Is there an option to set an item option as disabled ? ... they have a bunch of samples with some rows as disabled, but no explanation as to how they accomplish this. By checking the source code, I can see some of the data rows have an attribute as disabled:true ... I assumed all I had to do was to set this property to my objects, but still, not able to disable an item.

CodePudding user response：

In your <ng-option>, put a [disabled] attribute with some conditional in it.

example

<ng-option [value]="item.value" [disabled]="someFunction(item)">{{item.name}}</ng-option>

CodePudding user response：

As you said, adding disabled:true to the object you want to disable is correct.

The following code finds one person and disable him.

this.dataService.getPeople().subscribe((people) => {
      this.people = people;
      const p2 = this.people.find((p) => p.id === '5a15b13c728cd3f43cc0fe8a'); 
      p2.disabled = true;
    });

The following code finds all people whom isActive prop is false and disable them

 this.dataService.getPeople().subscribe((people) => {
      this.people = people.map((p) =>
        p.isActive ? p : { ...p, disabled: true }
      );
    });

Here is the code on StackBlitz