javascriptangulartypescriptangular-ngselect

Disable Item selection on ng-select. Overriding the default item selection of ng-select


I am using an angular-multiselect component in my code where in I upload the list of items and then populate the [data] variable of the angular-multiselect. This lists the list of data with checkboxes and gives me the option to select all,search and all sorts of things. But the drawback of this component is that it lags when the data is too large. I tried to do a workaround that but with no fruitful result. Then I decided to shift to ng-select this lists the data ( large amount of data ) with no visible lag issues the performance is great but there are some features which are missing in this. I managed to add the checkboxes and all with the help of ng-template but i want to disable the item selection of ng-select. What I mean to say is that when the ng-select is populated with data and when the dropdown is expanded, if I click any of the list item it should not select the data and display it above which ng-select does by default. How can I achieve this

Angular Version: 5.2.0 ng-select version: 1.6.3


Solution

  • There is a sneaky way to do it using CSS. StackblitzDEMO