Angular ng-repeat 张图片，其中只有 2 张图片带有说明

Question

我正在使用 ng-repeat 绑定来自指令的图像（与我们通常进行星级评分相同）。就我而言，我有图片，其中一些应该有标题，而不是全部。有没有办法制定一个条件，只显示第二张和最后一张图片的标题？没有为所有图像创建数组

我的html:

<ul class="qty">
<li ng-repeat="image in imagesArray">
    <img ng-model="imgUrl" ng-src="{{imgUrl}}">
    <div>caption</div>
</li>

我的应用程序：

var myDirectives = (function () {
var myDirectives = angular.module('myDirectives', []);
myDirectives.directive('myImages', function () {
    return {
        restrict: 'A',
        scope: {
            qty: '='
        },
        link: function ($scope) {
            $scope.imgUrl = "http://farm6.staticflickr.com/5579/14671096893_806ec359b7_m.jpg";
            $scope.imagesArray = [];
            for (var i = 0; i < $scope.qty; i++) {
                $scope.imagesArray.push({});
            }
        },
        templateUrl: function () { return 'stars.html' },
    }
});
return myDirectives; }());

笨蛋： http://plnkr.co/edit/IdXaRDB9INZlZbWSTmam?p=preview

Answer 1

是的，您可以使用 $last 和 $first。

请参阅 ngRepeat 文档了解更多信息。

<ul class="qty">
<li ng-repeat="image in imagesArray">
    <img ng-model="imgUrl" ng-src="{{imgUrl}}">
    <div ng-if="$first || $last">caption</div>
</li>

Answer 2

完成，请看我的回答。工作正常

<ul class="qty">
    <li ng-repeat="image in imagesArray track by $index">
        <img ng-model="imgUrl" ng-src="{{imgUrl}}">
        <div ng-if="$index===1 || $last">caption</div>
    </li>
</ul>

Angular ng-repeat 张图片，其中只有 2 张图片带有说明

Angular ng-repeat images with caption only for 2 of them

image

caption

conditional-statements

angularjs

ng-repeat