無法在ng-reapeat中設置AngularJS變量

我想實現僅在點擊後應該完全可見的列表。但是，當我嘗試在ng-click上設置值時，值範圍僅在點擊元素上。無法在ng-reapeat中設置AngularJS變量

<ul data-ng-init="showIataList = false"> 
    {{showIataList}} <-- always false :(but should be true after click on link from list 
    <li data-ng-repeat="value in data.departureIataList"> 
    <a href="javascript:" 
     data-ng-if="$index < 3 || showIataList"> 
     {{value}} 
    </a> 
    {{showIataList}} 
    <a href="javascript:" 
     data-ng-if="!showIataList && $index == 3" 
     data-ng-click="showIataList = true"> 
     {{showIataList}} <-- after click is true, but true should be and on the top showIataList variable 
    </a> 
    </li> 
</ul>

來源

2017-07-28 Edgaras Karka

供參考，每ng-repeat項目有他自己的範圍。這是爲什麼data-ng-click="showIataList = true"適用於特定範圍而不適用於主要$scope的原因。

比如，你可以寫：

$scope.data.showIataList = false;

，一切都將工作

或在您的情況：<ul data-ng-init="data.showIataList = false">

Fiddle Demo

來源

2017-07-28 06:45:08

問題爲b由於這個標籤。它有ng-如果在裏面，所以它創建一個新的作用域並從父作用域繼承數據。

<a href="javascript:" 
    data-ng-if="!showIataList && $index == 3" 
    data-ng-click="showIataList = true">

因爲從父ngIf繼承所以你showIataList也被複制到ngIf。

parentScope.showIataList = ngIf.showIataList

但是你點擊鏈接後，ngIf.showIataList被改變，但這種改變將不會傳播到parentScope.showIataList（因爲showIataList是（原始值）

這就是爲什麼你看到裏面ngIf，showIataList是正確的，但在parentScope它仍然假。

您可以通過移動showIataList修復它變成像這樣的對象。

<ul data-ng-init="iataList = {isShow:false}"> 
    {{iataList.isShow}} 
    <li data-ng-repeat="value in data.departureIataList"> 
    <a href="javascript:" 
     data-ng-if="$index < 3 || iataList.isShow"> 
     {{value}} 
    </a> 
    {{showIataList}} 
    <a href="javascript:" 
     data-ng-if="!iataList.isShow&& $index == 3" 
     data-ng-click="iataList.isShow= true"> 
     {{iataList.isShow}} 
    </a> 
    </li> 
</ul>

來源

2017-07-28 06:51:19

無法在ng-reapeat中設置AngularJS變量

回答

相關問題