java - 如何在 AngularJS ng-repeat 中使用索引显示列表项

标签 java javascript html angularjs twitter-bootstrap

我需要以 Angular 显示项目列表,每行只有 2 个项目。假设列表中有 5 个项目,输出应为 3 行,前 2 行 2 列,最后一行 1 列。

<div ng-repeat="result in results" ng-if="$index % 2 == 0" class="row">
    <div class="col-xs-6">{{result[$index]}}</div>
    <div class="col-xs-6">{{result[$index + 1]}}</div>
</div>

上面是代码,当结果是项目列表时,此代码可以正常工作。但是,当结果是对象列表时,它不会打印。例如,如果结果对象具有birthDate 或Id 属性,我如何显示它们? {{result.birthDate}} 打印正确的值,但如何打印 index + 1 值 ?我尝试过 {{result[$index + 1].birthDate}}{{result.birthDate[$index + 1]}} 不起作用。 下面的代码不起作用,但是,我需要这样的东西,

<div ng-repeat="result in results" ng-if="$index % 2 == 0" class="row">
    <div class="col-xs-6">{{result[$index].birthDate}}</div>
    <div class="col-xs-6">{{result[$index + 1].birthDate}}</div>
</div>

感谢您的帮助

最佳答案

演示 - http://jsfiddle.net/softvar/yk8phbc5/

JS:

var app = angular.module('myApp', []);

app.controller('myCtrl', function ($scope) {
    $scope.results = [
        {birthDate: '01/08/1982'},
        {birthDate: '11/08/1992'},
        {birthDate: '21/08/2002'},
        {birthDate: '31/08/2012'}
    ]
});

HTML:

<div ng-app="myApp" ng-controller="myCtrl">
    <div ng-repeat="result in results" ng-if="$index % 2 == 0" class="row">
        <div class="col-xs-6">First: {{results[$index].birthDate}}</div>
        <div class="col-xs-6">Second: {{results[$index + 1].birthDate}}</div>
        <br/>
    </div>
</div>

关于java - 如何在 AngularJS ng-repeat 中使用索引显示列表项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30696583/

相关文章:

javascript - JSON.parse() 和 eval() 之间的区别

javascript - 加载内容时的图像

javascript - 在不使用禁用属性的情况下使输入字段看起来已禁用

javascript - 通过 jQuery 或 CSS3 从右向左滑动一个 div

java - System.lineSeparator() 在 android 中不存在

java - 如何在 Kivy 中将 android.bluetooth.socket 输入流转换为 python 字符串?

java - 条件语句超出范围错误

java - "instantiated"和 "subclass"之间的区别

javascript - 父 View 不会被替换

html - 左边的图标有间距,但边框根据文本