Błąd: [$ compile: nonassign] Wyrażenie użyte w dyrektywie "uibTab" jest nieprzenoszalne

Question

Mam prosty scenariusz. Dwie zakładki, zakładka 1 & 2. Konieczność wyboru Tab 1 za pomocą linku.

HTML:

<p> 
    <a href="#" ng-click="selectTab1()"> 
    <span class="glyphicon glyphicon-plus-sign"></span> Select TAB 1 
    </a> 
</p> 
<uib-tabset> 
    <uib-tab heading="Tab 1" active="activeTab==true" ng-click="clickTab1()"> 
    Content 1 
    </uib-tab> 
    <uib-tab heading="Tab 2 (default)" active="activeTab==false" ng-click="clickTab2()"> 
    Content 2 
    </uib-tab> 
</uib-tabset> 

kod Kontroler tutaj:

$scope.activeTab = false; 

    $scope.selectTab1 = function() { 
    $scope.activeTab = true; 
    } 
    $scope.clickTab1 = function() { 
    $scope.activeTab = true; 
    } 
    $scope.clickTab2 = function() { 
    $scope.activeTab = false; 
    } 

Plunker jest tutaj: http://plnkr.co/edit/5yBHmXZBHyWYZEtmshad?p=info

Po kliknięciu w tabeli 1 lub 2, Dostaję następujący błąd:

Error: [$compile:nonassign] Expression 'activeTab==true' used with directive 'uibTab' is non-assignable! 

Mogę zmienić to wyrażenie 'activeTab==true' na krótszy sposób, jak "activeTab", ale wydaje się, że nie działa.

Answer 1

Lepiej zaktualizować zmienną zakres i powiązać go z active atrybutu swoich zakładkach:

$scope.activeTab = []; 

$scope.selectTab1 = function(index) { 
    $scope.activeTab[index] = true; 
    }; 

$scope.clickTab = function(index) { 
    $scope.activeTab[index] = true; 
}; 

W widoku:

<uib-tab heading="Tab 1" active="activeTab[0]" ng-click="clickTab(0)"> 
    Content 1 
</uib-tab> 
<uib-tab heading="Tab 2 (default)" active="activeTab[1]" ng-click="clickTab(1)"> 
    Content 2 
</uib-tab> 

I zaktualizowaniu plunkr

ten sprawia również, że implementacja jest bardziej przydatna niż poprzednio (na przykład może być z łatwością używana wewnątrz ng-repeat, jeśli zajdzie taka potrzeba. es).

referencyjny: GitHub Issue

Answer 2

Dla najnowszej wersji (2.4.0 UIB) powinno być tak:

W sterowniku:

$scope.activeTab = 1; 

W widzenia:

<uib-tabset active="activeTab"> 
    <uib-tab index="0" heading="Tab 1"> 
     Content 1 
    </uib-tab> 
    <uib-tab index="1" heading="Tab 2"> 
     Content 2 
    </uib-tab> 
</uib-tabset>