SuiSelect: Cannot read property 'isVisible' of undefined

[nicoparce]

trafficstars

When upgraded Angular to version 9, SuiSelect component is not working properly because of the following excpetion:

"TypeError: Cannot read property 'isVisible' of undefined at SuiSelect.get [as isVisible] (http://localhost:4200/vendor.js:133588:31) at SuiSelectBase_HostBindings (http://localhost:4200/vendor.js:134176:156) at setHostBindingsByExecutingExpandoInstructions (http://localhost:4200/vendor.js:21588:25) at refreshView (http://localhost:4200/vendor.js:21864:9) at refreshComponent (http://localhost:4200/vendor.js:22952:9) at refreshChildComponents (http://localhost:4200/vendor.js:21625:9) at refreshView (http://localhost:4200/vendor.js:21868:13) at refreshDynamicEmbeddedViews (http://localhost:4200/vendor.js:22888:21) at refreshView (http://localhost:4200/vendor.js:21842:9) at refreshComponent (http://localhost:4200/vendor.js:22952:9)"

Version of Angular, ng2-semantic-ui, and Semantic UI:

Angular: 9.0.3

ng2-semantic-ui: 0.9.7 or 0.10.0-alpha.6

Semantic UI: 2.2.13

[Piquelyz]

Hi @nicoparce , I have the same problem after update Angular 9.

After debug, I found in Angular 9 there is a change to the decorator 'ViewChild',

// query results sometimes available in ngOnInit, sometimes in ngAfterViewInit` (based on template) @ViewChild('foo') foo: ElementRef;

Angular 9: // query results available in ngOnInit @ViewChild('foo', {static: true}) foo: ElementRef;

OR // query results available in ngAfterViewInit @ViewChild('foo', {static: false}) foo: ElementRef; (by default) ‘ ` In Angular 9, by default({static: false}) the viewChild will be init after 'ngAfterViewInit ', that's why some properties are 'undefined '.

To corrrect this, we need to update ng-semantic-ui by changing all @ViewChild by adding {static: true}

For more info, you can see here Static query migration guide

[Piquelyz]

But seeing nobody updating this lib, I dont know if it's possible to use it in Angular 9.

[christianmlima]

I tried the "static: false" approach and it didn't worked.