Skip to content
This repository was archived by the owner on May 29, 2019. It is now read-only.
This repository was archived by the owner on May 29, 2019. It is now read-only.

Tabs: uib-tab index values are not correct when using ng-if on some tab elements #6257

@grichka

Description

@grichka

Bug description:

If all uib-tab elements of a uib-tabset have an ng-if attribute except the last one, the last tab has the index 0 and is selected by default.
It seems the uib-tab indexes are not based on their order but on the moment they appear in the DOM.

<uib-tabset active="0">
  <uib-tab ng-if="true">
    <uib-tab-heading>Tab 1</uib-tab-heading>
    <p>Some Text 1</p>
  </uib-tab>
  <uib-tab ng-if="true">
    <uib-tab-heading>Tab 2</uib-tab-heading>
    <p>Some Text 2</p>
  </uib-tab>
  <uib-tab ng-if="true">
    <uib-tab-heading>Tab 3</uib-tab-heading>
    <p>Some Text 3</p>
  </uib-tab>
  <uib-tab>
    <uib-tab-heading>Tab 4</uib-tab-heading>
    <p>Some Text 4</p>
  </uib-tab>
  <uib-tab>
    <uib-tab-heading>Tab 5</uib-tab-heading>
    <p>Some Text 5</p>
  </uib-tab>
</uib-tabset>

Tab 1 has index 2
Tab 2 has index 3
Tab 3 has index 4
Tab 4 has index 0
Tab 5 has index 1

(an ugly workaround is to put ng-if="true" statements on every uib-tab that do not need to be displayed depending on conditions)

Link to minimally-working plunker that reproduces the issue:

http://plnkr.co/edit/ReAMeHlVWoM5JNcFrWLT?p=preview

Version of Angular, UIBS, and Bootstrap

Angular: 1.4.10

UIBS: 2.1.3

Bootstrap: 2.3.1

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions