is there any way to disable angular multiselect(cuppa labs) dynamically

Question

I am using multi select dropdown(cuppa labs) from this link https://www.npmjs.com/package/angular2-multiselect-dropdown But I am unable to disable the dropdown.

initially if i set In settings disabled:true is working fine but I want disabled:false initially then i need to change disabled:true after the success response from the api.

documentDropdownSettings = {
        text: "Required Document",
        badgeShowLimit: 3,
        enableSearchFilter: true,
        maxHeight: 150,
        classes: "myclass custom-class",
        showCheckbox: true,
        enableFilterSelectAll: false,
        disabled:false

    }

this.taskService.getTaskDetails(this.taskId, (success) => {    
   this.documentDropdownSettings.disabled=true
        }, (error) => {
    enter code here
        })

I want to make the dropdown disabled dynamically.

Answer 1

I believe the issue is that the the settings object is immutable. you need to change the object reference not its properties for the binding to take effect.

doing your change, and changing the reference will probably work. something like :

this.taskService.getTaskDetails(this.taskId, (success) => {    
     this.dropdownSettings['disabled'] = true;
     this.dropdownSettings = Object.assign({}, this.dropdownSettings);
   }, (error) => {
    enter code here
})

P.S their official approach seems to be a bit awkward, they recreate the object for each settings change in their documentation..