weixin_39977136
2021-01-12 18:11 阅读 0

Tab does not display results unless I click on it

I have 2 tabs on a page, each with a list of items. When i open the page, the first tab does not display data. I click on the 2nd tab and see the results. I then click on the first tab and the data is displayed.

The calls to the backend are working fine, as I can see the data being returned and populating the list used by the page.

该提问来源于开源项目:valor-software/ngx-bootstrap

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享

9条回答 默认 最新

  • weixin_39541189 weixin_39541189 2021-01-12 18:11

    I have the same issue.Any help?

    点赞 评论 复制链接分享
  • weixin_39571403 weixin_39571403 2021-01-12 18:11

    Same issue here!

    点赞 评论 复制链接分享
  • weixin_39582480 weixin_39582480 2021-01-12 18:11

    Are you setting [active] on a tab to true? Otherwise they'll all be false and no active.

    点赞 评论 复制链接分享
  • weixin_39571403 weixin_39571403 2021-01-12 18:11

    I think problem did not have to do with ng2-bootstrap itself but with the svg we were rendering in angular

    点赞 评论 复制链接分享
  • weixin_39977136 weixin_39977136 2021-01-12 18:11

    I had active set to true on the first tab, which was the one that has the issue.

    点赞 评论 复制链接分享
  • weixin_39720510 eternal? 2021-01-12 18:11

    please provide plunker so I can reproduce an issue, thanks in advance

    点赞 评论 复制链接分享
  • weixin_39977136 weixin_39977136 2021-01-12 18:11

    Further clarification on the issue. In the tab, the header row of the table and an add button are displayed in the tab, just no rows in the table are displayed even though there are results from the server. If I click the 2nd tab, I see a similar table with data, then click on the first tab, then see the data there ...

    点赞 评论 复制链接分享
  • weixin_39977136 weixin_39977136 2021-01-12 18:11

    I resolved the issue. It was related to the use of changeDetection: ChangeDetectionStrategy.OnPush, in the definition. I ended up importing ChangeDetectionStrategy, then added this.cd.markForCheck(); in each of the data => methods where the http call results handled. Now upon initial entry of the page, the data is displaying as expected.

    点赞 评论 复制链接分享
  • weixin_39944146 weixin_39944146 2021-01-12 18:11

    Hi , I'm trying to achieve lazy loading of tabs functionality.

    Let me explain my scenario. I have 2+ static tabs in a page. inside each , there is a child component. I want to load the data of tabs only on tab selection (expect for first tab). Parent.html: <div> <tabset> <tab heading="1"> <child [someInput]="input"></child> </tab> <tab heading="2"> <child [someInput]="input"></child> </tab> </tabset> </div>

    Please suggest. Thank you in advance.

    点赞 评论 复制链接分享

相关推荐