Angularjs UI引导程序在静态选项卡中动态选择不起作用

发布时间：2020-12-17 08:53:01 所属栏目：安全来源：网络整理

导读：我有三个静态选项卡和一个按钮,使用ng-click =“selectThirdTab()” div ng-controller="Ctrl" input type="button" value="Select third tab" ng-click="selectThirdTab()" / tabset justified="true" tab heading="First" active="isFirstActive"/tab tab

我有三个静态选项卡和一个按钮,使用ng-click =“selectThirdTab()”

<div ng-controller="Ctrl">
        <input type="button" value="Select third tab" ng-click="selectThirdTab()" />
        <tabset justified="true">
            <tab heading="First" active="isFirstActive"></tab>
            <tab heading="Second" active="isSecondActive"></tab>
            <tab heading="Third" active="isThirdActive"></tab>
        </tabset>
</div>

函数“selectThirdTab”如下：

$scope.selectThirdTab = function () {
    $scope.isThirdActive = true;
}

吸管在这里：Plunker

最初选择第一个选项卡,单击按钮,结果是选中的第三个按钮.现在,如果您选择其他选项卡,然后再次单击“选择第三个选项卡”按钮,则不会选择第三个按钮.
怎么了？

或者你可以这样：

angular.module('plunker',['ui.bootstrap']);
var Ctrl = function ($scope,$timeout) {
    $scope.isActive = [{active:true},{active:false},{active:false}];
    $scope.selectThirdTab = function () {
          $scope.isActive[2].active = true;
    }
}

并在HTML中

<tabset justified="true">
        <tab heading="First" active="isActive[0].active"></tab>
        <tab heading="Second" active="isActive[1].active"></tab>
        <tab heading="Third" active="isActive[2].active"></tab>
    </tabset>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!