javascript – Angular UI选项卡的Select事件未按预期工作

我正在使用Angular UI Tabs,如下所示.我的问题是内部uib-tabset选择事件正在加载时触发.换句话说没有点击该选项卡(heading =“抱歉”).你能告诉我如何理清吗？这个问题？

这是Plunker.

 <uib-tabset active="active">
    <uib-tab index="0" heading="Static title">Static content</uib-tab>
    <uib-tab index="3" select="alertMe()">
      <uib-tab-heading>
        <i class="glyphicon glyphicon-bell"></i> Alert!
      </uib-tab-heading>
      I've got an HTML heading, and a select callback. Pretty cool!
    </uib-tab>

     <uib-tab heading="My issue">
        <uib-tabset type="pills">
            <uib-tab heading="sorry" select="alertMe()">

            </uib-tab>

        </uib-tabset>
     </uib-tab>

</uib-tabset>

解决方法:

您需要将内部嵌套的uib-tabset的active属性设置为null.默认情况下,始终选择第一个选项卡,因此执行alertMe功能.

<uib-tabset active="active">
  <uib-tab index="0" heading="Static title">Static content</uib-tab>
  <uib-tab index="3" select="alertMe()">
    <uib-tab-heading>
      <i class="glyphicon glyphicon-bell"></i> Alert!
    </uib-tab-heading>
    I've got an HTML heading, and a select callback. Pretty cool!
  </uib-tab>

  <uib-tab heading="My issue">
    <uib-tabset type="pills" active="null">
      <uib-tab heading="sorry" select="alertMe()">

      </uib-tab>

    </uib-tabset>
  </uib-tab>

</uib-tabset>

Working Plunker

OP的反馈：对我来说,active =“ – 1”有效.

标签：javascript,angularjs,angular-ui-bootstrap
来源： https://codeday.me/bug/20190702/1353429.html