javascript - 如果循环中的最后一个属性不同,则 Angular 添加元素

标签 javascript angularjs

我的比赛(如在游戏中) Controller 中有一个包含对象的数组:

    var tiles = [{name:"test",zPos:0},
     {name:"test2",zPos:0},
     {name:"test3",zPos:1},
     {name:"test4",zPos:2}]

在我的 html 中,我循环对象:

    <p ng-repeat="tile in matches.tiles">
         z{{tile.zPos}} - {{tile.name}}
    </p>

我怎样才能添加一个额外的div,比如

<div class="newzindex"></div>

如果 tile.zPos 属性与上一个循环不同,那么每个唯一的 zPos 属性都有一个唯一的 div。我尝试达到的结果看起来像

   <p>
         z0 -   test
   </p>
   <p>
         z0 -   test2
   </p>
   <div class="newzindex"></div>
   <p>
         z1 -   test3
   </p>
   <div class="newzindex"></div>
   <p>
         z2 -   test4
    </p>

最佳答案

您可以使用 ng-repeat-startng-repeat-end 指令 ( https://docs.angularjs.org/api/ng/directive/ngRepeat )

HTML

<p ng-repeat-start="tile in matches.tiles ">
    z{{tile.zPos}} -   {{tile.tile.name}}
</p>
<div ng-if="matches.tiles[$index + 1].zPos != tile.zPos" ng-repeat-end class="newzindex"></div>

关于javascript - 如果循环中的最后一个属性不同,则 Angular 添加元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37286994/

相关文章:

javascript - 为什么我的工厂出现喷油器错误?

javascript - 在移动版 Safari 中向下滚动时执行操作

javascript - 典型的 AngularJS 工作流程和项目结构(使用 Python Flask)

angularjs - 如何在 AngularJS 1.2 中获取 HTTP 响应状态代码

javascript - 关于 'the angular way' 的不安全感

javascript - angularjs防止XSS攻击

javascript - 查找 reCAPTCHA 何时重新加载

javascript - jQuery .each() 不更新

javascript - JavaScript 中的 while 循环永远运行

javascript - 数据更新时的 OwlCarousel 自动高度