AngularJS：ng $ repeat中沒有$ scope的變量是否在本地範圍內？

這裏是代碼：

<ul> 
    <li ng-repeat="i in items" ng-class="{'red': click}"> 
    <span ng-click="click = !click">{{i}}</span> 
    </li> 
</ul> 

<ul> 
    <li ng-repeat="j in items" ng-class="{'red': f_click}"> 
    <span ng-click="fun_click($index)">{{j}}</span> 
    </li> 
</ul>

f_click變化fun_click功能。

$scope.fun_click = (idx) -> 
    $scope.f_click = !$scope.f_click

完整代碼： http://plnkr.co/edit/Zmoqbv?p=preview

我想知道的是，在第一列表中的變量click是每個NG-repeat元素的局部變量？
它是如何工作的？

我該如何讓第二個列表中的f_click與click一樣工作？
似乎$scope.f_click是ng控制器中唯一的變量。

更新時間：

我覺得我只是做的事情是錯誤的。
我不應該在「視圖」中寫東西。

只讀視圖;
在控制器中只寫。
http://www.jacopretorius.net/2013/07/angularjs-best-practices.html

來源

2013-10-03 zx1986

感謝你們！我讀了你所有的答案，我學到了很多！非常感謝你！我希望我能在某些時候幫助別人。 – zx1986

我怎麼能做出第二個列表中f_click就像點擊

正如我知道你不能。從你的第一個例子click不涉及任何範圍。

f_click是指特定的範圍和任何變化上的所有元素分佈（又名在你的循環中的所有項目）

可以提供每個值標誌，如：

$scope.items2 = [ 
{'name': 'Google','value':false}, 
{'name': 'Apple','value':false}, 
{'name': 'Yahoo','value':false}, 
{'name': 'IBM','value':false}, 
]; 

$scope.fun_click = (item) -> 
    item.value = !item.value;

HTML

<ul> 
    <li ng-repeat="j in items2" ng-class="{'red': j.value}"> 
    <span ng-click="fun_click(j)">{{j.name}}</span> 
    </li> 
</ul>

請參閱Plunker

來源

2013-10-03 07:25:10

你甚至不需要給他們默認的'value：false'，你知道：http://plnkr.co/edit/qgXbDp?p=preview – Cherniv

@Cherniv你是對的100％，但它使代碼可讀。 2個月後其他程序員需要花時間去了解它爲什麼是假的。它就像在Java中輸入'if（flag）'或'if（flag == true）' –

ng-repeat爲每次迭代創建一個範圍。 click變量居住在每個ng-repeat範圍內，換句話說它是私有的。如果將{{click}}放置在<body ng-controller="MainCtrl">之後但在ng-repeat之前，則它不會顯示任何內容，因爲click存在於內部範圍中。

在另一方面f_click生活在MainCtrl的範圍，這是父範圍兩者ng-repeat秒。改變它的功能（fun_click）也位於父範圍內。 ng-repeat範圍繼承此變量的單個實例，因此觀察到的行爲。

要使f_click工作爲click您必須使其對每個ng-repeat迭代的範圍保密。一種解決方案是在ng-repeat內部的控制器中定義f_click和fun_click()。其他解決方案是可能的

來源

2013-10-03 07:26:27

「ng-repeat爲每次迭代創建一個範圍。」謝謝！ @尼科斯我會更深入地閱讀文檔。 – zx1986

第一個ngRepeat工作原因，第二個不是因爲ngRepeat爲每個項目創建一個範圍。換句話說，items中的每個項目都有click變量的實例，並且通過在ngClick中切換click變量，您實際上正在使用私有實例。在第二個示例中，您使用控制器的$scope訪問f_click，該控制器是ngRepeat作用域的父級，因此更改會傳播到所有子作用域。

一個簡單的解決問題的方法是在ngRepeat創建f_click實例因此傳遞給你的函數：

// Script 
$scope.fun_click = (toggle) -> 
    return !toggle 

// HTML 
<span ng-click="f_click=fun_click(f_click)">{{j}}</span>

如果你想保持$scope的狀態，你可以使用字典來跟蹤狀態每個$index：

// Script 
$scope.form_status = {} 
$scope.fun_click = (index) -> 
    $scope.form_status[index] = !$scope.form_status[index] 

// HTML 
<li ng-repeat="j in items" ng-class="{'red': form_status[$index]}"> 
    <span ng-click="fun_click($index)">{{j}}</span> 
</li>

這裏更新plunker：http://plnkr.co/edit/w6RLed?p=preview

來源

2013-10-03 07:28:21 marcoseu

AngularJS：ng $ repeat中沒有$ scope的變量是否在本地範圍內？

回答

相關問題