Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

sui-tabset cannot work in Angular 9 #447

Open
alfred-f-yu opened this issue Mar 22, 2020 · 5 comments
Open

sui-tabset cannot work in Angular 9 #447

alfred-f-yu opened this issue Mar 22, 2020 · 5 comments

Comments

@alfred-f-yu
Copy link

Bug description:

Code:
<sui-tabset style="padding-left: 0;padding-right: 0">
<div class="ui top attached tabular menu">
<a class="item" suiTabHeader="1">111</a>
<a class="item" suiTabHeader="2">222</a>
<a class="item" suiTabHeader="3">333</a>
</div>
<div class="ui bottom attached segment" style="border: none;" suiTabContent="1">
.......
</div>
<div class="ui bottom attached segment" style="border: none;" suiTabContent="2">
.......
</div>
<div class="ui bottom attached segment" style="border: none;" suiTabContent="3">
.......
</div>
</fui-tabset>

ERROR TypeError: Cannot set property 'isActive' of undefined
at SuiTabset.set activeTab [as activeTab] (vendor.js:346545)
at SuiTabset.activateFirstTab (vendor.js:346568)
at SuiTabset.loadTabs (vendor.js:346706)
at SuiTabset.ngAfterContentInit (vendor.js:346561)
at callHook (vendor.js:41649)
at callHooks (vendor.js:41613)
at executeInitAndCheckHooks (vendor.js:41554)
at refreshView (vendor.js:47941)
at refreshComponent (vendor.js:49332)
at refreshChildComponents (vendor.js:47630)

suiTabHeader and suiTabContent exist in the codes. I known if I missed suiTabHeader or suiTabContent, the same errors will happend. The error only happened in Angular 9, the same codes can work properly in Angular 8 or older.

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

Angular: 9.0.7

ng2-semantic-ui: 0.9.7

Semantic UI: 2.4.2

@vaindil
Copy link

vaindil commented Apr 8, 2020

This is because @ContentChildren does not have { descendants: true } set in tabset.ts. Angular noted this change here. This repo is dead, so you'll have to fork it to fix it.

@alfred-f-yu
Copy link
Author

Yes, thank you for your help.
I have changed to ngx-fomantic-ui, a fork of the ng2-semantic-ui. It also contains this bug, now it can work at Angular 9.

@eran-pinhas
Copy link

eran-pinhas commented May 14, 2020

Not sure it'll help, but check out https:/richardlt/ng2-semantic-ui (npm isntall @richardlt/ng2-semantic-ui)

it should be a maintained fork of this repo and should work in angular 9

@frankpaap
Copy link

I have the same error as above, so this repo is dead @vaindil why?

@BruneXX
Copy link

BruneXX commented Apr 27, 2022

Not sure it'll help, but check out https:/richardlt/ng2-semantic-ui (npm isntall @richardlt/ng2-semantic-ui)

it should be a maintained fork of this repo and should work in angular 9

Hi @eran-pinhas is this still working in angular 9, did you have a working version? thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants