Primeng: Dropdown - ViewDestroyedError

[Mysame]

Minimal reproduction of the problem with instructions
Using @angular/forms's FormBuilder approach, set a p-dropdown to disabled

error-handler.ts:106 Error: ViewDestroyedError: Attempt to use a destroyed view: detectChanges
    at viewDestroyedError (core.js:25516)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:39361)
    at checkAndUpdateView (core.js:38376)
    at callWithDebugContext (core.js:39716)
    at Object.debugCheckAndUpdateView [as checkAndUpdateView] (core.js:39299)
    at ViewRef_.detectChanges (core.js:27092)
    at Dropdown.set [as disabled] (dropdown.js:116)
    at Dropdown.push../node_modules/primeng/components/dropdown/dropdown.js.Dropdown.setDisabledState (dropdown.js:256)
    at forms.js:2612
    at forms.js:3361

• Angular version: 8.1.2
• PrimeNG version: 8.0.1

[digitalcraftco]

I'm getting same error even without disabling the dropdown. It seems to be related to FormBuilder. If I remove formControlName="" the error goes away.

• Angular version: 8.1.2
• PrimeNG version: 8.0.1

[cwatzl]

Also getting this error.

I created a minimal test (Angular CLI - based) project to demonstrate the issue

https://github.com/cwatzl/primeng-bug-7970

It contains a test in src/app/app.component.spec.ts that demonstrates this behavior.

• Angular version: 8.2.0
• PrimeNG version: 8.0.2

[sathishkumarnarayanasamy]

Hi,
The issue is with FormControl & FormControlDirective and not related to Dropdown. This is already reported as an issue in Angular. Please see the following Issue
Details:
When FormControlDirective gets destroyed it is not removed from FormControl (for ex. Form Control's disabledChangefn array has reference to destroyed FormControlDirective's Control Value Accecssor -> in this case, DropDown control). So, when you again call enable or disable, this calls the destroyed control, which throws the error. In fact, this can be reproduced with one component also:
stackblitz

[cwatzl]

Well, whatever the culprit, for the time being I could work around this issue by downgrading to PrimeNG 7.1.3 (which in my application requires a compatibility hack for Angular 8, but I already have that in place).

[a-stangl]

Have the same issue when trying to upgrade to Angular 8. Looks like the problem is this line of code here:

https://github.com/primefaces/primeng/blob/master/src/app/components/dropdown/dropdown.ts#L265

if I wrap the this.cd.detectChanges(); like this

if (!this.cd.destroyed) {
    this.cd.detectChanges();
}

the problem is gone. Not sure if its safe to use this.cd.destroyed though as it is declared in ViewRef and not ChangeDetectorRef ... (https://angular.io/api/core/ViewRef#destroyed)

[yelhouti]

@StAn187
I use it like this:

if(!(this.cd as ViewRef).destroyed) {
            this.cd.detectChanges();
        }

@AustinMatherne I think that problem we see here, (in my case at least, where I hide and disable th dropdown), the culprit is primeng. It tries to detected changes on a component not in the view anymore.
I will PR a the fix above