javascript - ng-repeat 和 $scope 问题

Question

我有一个页面使用 Ng-repeat 连续显示 3 个图像，但无论我单击哪个图像，我都只能看到该特定行中显示的第一张图像的图像。

模板:

<div id="galscrolldiv" class="row" ng-repeat="image in images" ng-if="$index % 3 === 0">
    <div class="col col-33" ng-if="$index < images.length">
        <div ng-click="seeOne(image)">
            <img ng-src="{{images[$index].src}}" width="100%" />
        </div>
    </div>
    <div class="col col-33" ng-if="$index + 1 < images.length">
        <div ng-click="seeOne(image)">
            <img ng-src="{{images[$index + 1].src}}" width="100%" />
        </div>
    </div>
    <div class="col col-33" ng-if="$index + 2 < images.length">
        <div ng-click="seeOne(image)">
            <img ng-src="{{images[$index + 2].src}}" width="100%" />
        </div>
    </div>
</div>

ng-click函数:

$scope.seeOne = function (image) {
    window.localStorage['fbid'] = image.fbid;
    $state.go('app.oneimg');
}

$scope.images:

angular.forEach(value, function (value, key) {
    if (key == 'photo') {
        $scope.images.push({
            id: i,
            fbid: inventorykey,
            src: ("data:image/jpeg;base64," + value)
        });
        i = i + 1;
    }
})

Answer 1

你在重复<div ng-click="seeOne(image)">在此示例中为 3 次，其中 image仅指您显示的 3 张图像中的第一个。如果您更改该行以匹配 <img>标记在它下面，您就会得到您正在寻找的结果。像这样的事情:

<div id="galscrolldiv" class="row" ng-repeat="image in images" ng-if="$index % 3 === 0">
    <div class="col col-33" ng-if="$index < images.length">
        <div ng-click="seeOne(images[$index])">
            <img ng-src="{{images[$index].src}}" width="100%" />
        </div>
    </div>
    <div class="col col-33" ng-if="$index + 1 < images.length">
        <div ng-click="seeOne(images[$index+1])">
            <img ng-src="{{images[$index + 1].src}}" width="100%" />
        </div>
    </div>
    <div class="col col-33" ng-if="$index + 2 < images.length">
        <div ng-click="seeOne(images[$index+2])">
            <img ng-src="{{images[$index + 2].src}}" width="100%" />
        </div>
    </div>
</div>