angular-ui-tabset：更改活動標籤內容

我在我的angular應用程序中使用ui-tab。我有2個選項卡（tab1和tab2），我想設置tab1作爲活動的一個編程方式時，在tab2按鈕。angular-ui-tabset：更改活動標籤內容

這是我的html代碼：

 <uib-tabset active="active" justified="true"> 
     <uib-tab id="tab1" index="0" heading="Tab 1" ng-click="active= 0"> 
    <!-- content1 --> 
     </uib-tab> 
    <uib-tab id="tab2" index="1" heading="Tab 2" ng-click="active= 1"> 
    <!-- content2 --> 
<button ng-click="goToTab1()"> Go to tab 1</button> 
    </uib-tab> 
    </uib-tabset>

這是goToTab1()實現：

$scope.goToTab1 = function() { 
      angular.element(document.querySelector("#tab1")).removeClass("active"); 
      angular.element(document.querySelector("#tab2")).addClass("active"); 
}

我的問題：

當我點擊按鈕（在TAB2）的TAB1被選中，但顯示的內容仍然是tab2內容。此外，在此之後，我點擊tab2，什麼都沒有發生，直到我點擊tab1多一個，然後如果我點擊tab2它的作品。

編輯

我已經嘗試在issue的解決方案，但我得到了同樣的問題。此外，當我直接在ng-click改變有效價值，它在所有

<button ng-click="active = 0"> Go to tab 1</button>

來源

2017-05-31 Ne AS

https://stackoverflow.com/questions/39860391/angular-ui-bootstrap-tabs-所使用的意見/指令用自己的範圍和隱藏/顯示他們不能改變標籤與一個按鈕裏面的標籤 – svarog

可能重複的[Angular UI引導標籤 - 無法更改選項卡內的按鈕標籤]（https://stackoverflow.com/questions/ 39860391/angular-ui-bootstrap-tabs-can-change-tabs-with-a-button-a-tab） – svarog

@svarog我在你給我的問題上試過了答案，但它不起作用 –

<uib-tabset active="current" justified="true"> 
    <uib-tab id="tab1" index="0" heading="Tab 1" ng-click="current = 0"> 
    <!-- content1 --> 
    </uib-tab> 
    <uib-tab id="tab2" index="1" heading="Tab 2" ng-click="current = 1"> 
    <!-- content2 --> 
    <button ng-click="goToTab1()"> Go to tab 1</button> 
    </uib-tab> 
</uib-tabset>

$scope.goToTab1 = function() { 
    $scope.current = 0; 
};

來源

2017-05-31 11:21:27

我已經試過，但它沒有影響 –

也許你沒有使用控制器，你已經定義了特定的tabset片段中的功能。 –

沒有影響。根據this question，你應該重構

<button ng-click="active = 0"> Go to tab 1</button>

要

<button ng-click="$parent.$parent.active = 0"> Go to tab 1</button>

我想一個更好的apprache將根據active

來源

2017-05-31 11:56:25 svarog

angular-ui-tabset：更改活動標籤內容

回答

相關問題