如何在 ng-repeat 中传递选定的 $index？答案

【问题标题】：How to pass the selected $index in ng-repeat?如何在 ng-repeat 中传递选定的 $index？
【发布时间】：2016-04-17 08:17:41
【问题描述】：

我想上传图片并显示在页面中。我有 5 个图像，所以有 5 个数组，我正在使用 ng-repeat 来显示它。

下面是我的翡翠形式的html：

                form.form-horizontal       
                    .form-group(ng-repeat="runningText in runningTexts")
                        .col-md-3
                            label.control-label Image {{$index+1}}
                            .image-upload-area.label-centerleft
                                p(onclick="$('#imageFile').click()") Click me to change
                                img.loading(ng-show="isUploading" src="/img/loading.gif")    
                                img.img-responsive.clickable(ng-src="{{runningText.image != '' ? '/img/' + runningText.image : '/img/logo_d.png'}}")                                    

                form#imageUpload(enctype="multipart/form-data" action="/api/admin/display/image" ng-upload="uploadDone(content)" method="post")
                    input#imageFile(type="file" name="image" onChange="$('#imageSubmit').click();return false;" style="display:none")
                    input#imageSubmit(type="submit" ng-click="isUploading = true"  style="display:none")

下面是我的 js 文件中的控制器：

    loadData = function(){  //page load function
    $http.get(apiPath)
        .success(function(data){  
            if (data != null){       
                $scope.runningTexts = data.displaySetting.runningText;
            }
        })  
    }  

    $scope.uploadDone = function(data) {  // upload finished function
    $scope.runningTexts[0].image = data.path;  // Problem here!!
    $scope.isUploading = false;
};

如何传递我在 html 中选择的索引并将其放回 $scope.runningTexts[0].image。现在我使用的是 0，所以我上传的每张图片都只会显示在数组 0 中。如果我上传到数组 1，或者 2 等等，我该怎么做？

【问题讨论】：

喜欢这个 ng-click="loadData ($index)"
@Sajeetharan，我的问题是在上传完成期间，我的 uploadDone 函数如何知道我上传到了哪个数组？我使用 ng-repeat 一次性加载所有数组。但是在上传过程中，我一次只上传一个数组。那是我的问题。

标签： javascript html angularjs pug

【解决方案1】：

您需要在 Image 的点击事件中调用一个函数并将 $index 作为参数传递给该函数。

 <div ng-app="myApp" ng-controller="MainCtrl">
<ul>
    <li ng-repeat="page in pages">
        <a ng-class="{ testClass: $index == pageNumber }" ng-click="setPageNumber($index)">{{ page }}</a>
    </li>
</ul>

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

  app.controller('MainCtrl', function($scope) {
  $scope.pages = [
    'Page One',
    'Page Two',
    'Page Three'
];

$scope.pageNumber = 0;
$scope.setPageNumber = function(index) {
    $scope.pageNumber = index;
    console.log(index)
}

});

你可以检查一下这个小提琴。

http://jsfiddle.net/razh/NFNvc/

【讨论】：