Add feature: Disable single option within ng-select

See original GitHub issue

I have an ng-select element where I would like to be able to disable the selection of a given option, whenever I want.

<ng-select [items]="comboboxElements"
           [bindValue]="comboboxElements['value']"
           dropdownPosition="bottom"
           virtualScroll="true"
           [ngModel]="active"
           (ngModelChange)="activeChange.emit($event)"
           (change)="onChange($event)">

    <ng-template ng-label-tmp
                 let-item="item">
        {{item.labelKey | translate}}
    </ng-template>

    <ng-template ng-option-tmp
                 let-item="item">
        {{ item.labelKey | translate }}
    </ng-template>
</ng-select>

I believe this feature would make sense to be available inside the ng-option-tmp, as so:

    <ng-template ng-option-tmp
                 [disabled]="item.disabled"
                 let-item="item">
        {{ item.labelKey | translate }}
    </ng-template>

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:7

github_iconTop GitHub Comments

6reactions
gongAllcommented, Feb 8, 2019

Sorry for the late update.

For whoever may concern, all I had to do on the .ts file was:

this.comboboxElements[0].disabled = true;

I believe this property should be documented, as I believe it is not very clear it exists.

2reactions
vladyourcommented, Mar 22, 2019

Wow! It works! Thank you!

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to set an option as disabled on ng-select? - Stack Overflow
As you said, adding disabled:true to the object you want to disable is correct. The following code finds one person and disable him....
Read more >
Ng Select Disabled - StackBlitz
Starter project for Angular apps that exports to the Angular CLI.
Read more >
Select | Angular Material
It is possible to disable the entire select or individual options in the select by using the disabled property on the <select> or...
Read more >
Angular 10|9|8 NgSelect with Single/ Multiple Selection and ...
multiple : Single or multiple options can be selected by setting true or false; searchable : Boolean; Enable or disable filter feature.
Read more >
select - AngularJS: API
Show / Hide Table of Contents ... It also handles dynamic <option> elements, which can be added using the ... However, ngOptions provides...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found