动态ng-classes

Question

我是棱角分明的新手，我正在努力实现这一目标：

将ng-click动作放入控制器中的函数内来缩短<div>动作。

现在我有ng-class个元素，其中包含我选择从文件输入加载的图片

每个div都包含一个放大按钮，此按钮会更改相关<div>的{​​{1}}（每个img的某种包装），令我烦恼的是我有太多{{{ 1}}属性所以我最终得到：

ng-class

现在因为我动态地创建div，我无法预测{1}中的索引，我也知道为每个索引创建函数是错误的，所以我该怎么做？

目前，它的写作方式 - 它的工作方式，我可以加载7张照片，每张照片都有自己的索引，只需要点击过多的代码这让我很生气。

这是加载2 imgs：

的输出结果

输出1：

 <img class="zoomPhoto" ng-click="mgZoomIn{1}=\'invisible\';mgZoomOut{1}=\'visible\';ngImgUploadDiv{1}=\'imgUploadDivhover\';ngimgWrapper{1}=\'imgWrapperhover\';ngMainImg{1}=\'mainImghover\'" ng-class="mgZoomIn{1}" src="Images/1425524419_SEARCH.png" />

输出2：

<img class="zoomPhoto ng-scope" ng-click="mgZoomIn0='invisible';mgZoomOut0='visible';ngImgUploadDiv0='imgUploadDivhover';ngimgWrapper0='imgWrapperhover';ngMainImg0='mainImghover'" ng-class="mgZoomIn0" src="Images/1425524419_SEARCH.png">

修改

我试图这样做（可能是错的）：

<img class="zoomPhoto ng-scope" ng-click="mgZoomIn1='invisible';mgZoomOut1='visible';ngImgUploadDiv1='imgUploadDivhover';ngimgWrapper1='imgWrapperhover';ngMainImg1='mainImghover'" ng-class="mgZoomIn1" src="Images/1425524419_SEARCH.png">

并且它不起作用，但一般来说，这就是我想要做的事情。

Answer 1

我正在谈论这样的事情：

$scope.changeClass = function(mgZoomIn, mgZoomOut, ngImgUploadDiv,
  ngimgWrapper, ngMainImg) {
  this.mgZoomIn = mgZoomIn,
    this.mgZoomOut = mgZoomOut,
    this.ngImgUploadDiv = ngImgUploadDiv,
    this.ngimgWrapper = ngimgWrapper,
    this.ngMainImg = ngMainImg;

  console.log(this.mgZoomIn);
  return this;

};