选择在离子

Question

多张图片我有这个网站：

<div ng-repeat="image in images"> 
<img ng-src="img/{{image}}_off.png" /> 
</div> 

而且这个JavaScript控制器：

$scope.images = ['imga','imgb','imgc']; 

我也有这些图像文件：

imga_off 
imga_on 
imgb_off 
imgb_on 
imgc_off 
imgc_on 

我需要在单击图像时在开启和关闭之间切换。

我不太确定最好的方法是什么。 是否为每个img元素附加ng模型？ 或者有没有更好的方法来做到这一点？

Answer 1

在$scope变量保持拨动数据：

var $scope.toggles = [false, false, false];

切换基于$index：

<div ng-repeat="image in images"> 
    <img ng-src="img/{{image}}_{{ toggles[$index] ? 'on' : 'off' }}.png" ng-click="toggles[$index] = !toggles[$index]"/> 
</div> 

注：此代码是未经测试，但是这是一个普遍的做法。您也可以保存切换数据作为$scope.images的一部分