角度在元素的作用域中保存一个值

Angular hold a value in element's scope

本文关键字:一个 保存 元素 作用域      更新时间:2023-09-26

我想将值存储在html DOM元素的作用域中。这是我的问题。
我有一个 JSON 对象数组。迭代数组并创建div s 。

 <div data-ng-repeat="student in students">
 {{student.address}}  
  //if student.address equals previous student address, then
   <div class="newStyle"> </div>
 </div 

迭代数组时,如果一个学生的地址值等于前一个学生的地址,则以下div 应该具有新样式。
我的解决方法是保留学生的地址,在迭代时,学生地址存储在变量(不是全局)中,在下一次迭代中,根据先前设置的地址检查新学生的地址。

请让我知道值可以保留在迭代范围内的任何方式。

您可以使用 $index 变量,它是重复元素的迭代器偏移量 (0..length-1):

 <div data-ng-repeat="student in students">
  //if student.address equals previous student address, then
   <div data-ng-class="{newStyle: student.address === students[$index-1].address}"> </div>
 </div 

请注意,您还可以使用 ng-class,它将帮助您自动添加类名,如果给定条件为 true,则student.address === students[$index-1].address .

有一种叫做$index的东西可以保存当前的迭代编号,你可以使用它。

$index将具有电流环路计数

学生

地址==学生[$index-1].地址

<div data-ng-repeat="student in students">
 {{student.address}}  
  <div ng-if="student.address==students[$index-1].address">
   <div class="newStyle"> </div>
  </div>
 </div>

使用$index可以在迭代时比较值。

   <div data-ng-repeat="student in students">
     {{student.address}}  
      //if student.address equals previous student address, then
       <div ng-class="{newStyle:students[$index-1].address == students[$index].address}"> </div>
     </div

如果学生的地址等于以前的学生地址,您可以使用控制器中的函数来应用新样式。


在控制器中定义一个保存地址的变量和一个用于检查重复地址的函数:

var student = "";
$scope.checkAddr=function(param){
student=param;
if(student==param){
return "newStyle";
}

在您的模板中:

<div data-ng-repeat="student in students">
 {{student.address}}  
  //if student.address equals previous student address, then
   <div ng-class="checkAddr(students[$index].address)"> </div>
 </div