pass index value using ng-repeat in onchange and input type

553 Views Asked by At

I have this html

<div ng-repeat="i in [1,2,3,4,5]">
<input type="file" class="form-control" ng-hide="true"
 accept="image/*" image="vm.venueImageList[i].file"
 file-upload="vm.venueImageList[i].file"
  resize-max-height="720"
  resize-max-width="1024"
   resize-quality="0.96"
   resize-type="image/jpg"
   onchange="angular.element(this).scope().vm.preUpload($index);"
   ng-image-compress/>
</div>

I want to pass the $index value but its says $index is undefined. can someone help me how to pass $index to the angularjs funciton.

Here is the function

preUpload:function(index){
            vm.hideLoader[index].value=true;
            setTimeout(function () {
                if(vm.venueImageList[index].file.compressed.dataURL){
                    vm.venueImageList[index].url=vm.venueImageList[index].file.compressed.dataURL;
                    vm.venueImageList[index].file=vm.convertBaseToImage(vm.venueImageList[index].url);
                    vm.uploadFile(index);
                }

            },4000);

        },
1

There are 1 best solutions below

0
On

Evaluate it as an AngularJS expression on the parent scope:

<div ng-repeat="i in [1,2,3,4,5]">
    <input type="file" class="form-control" ng-hide="true"
       accept="image/*" image="vm.venueImageList[i].file"
       file-upload="vm.venueImageList[i].file"
       resize-max-height="720"
       resize-max-width="1024"
       resize-quality="0.96"
       resize-type="image/jpg"
       ̶o̶n̶c̶h̶a̶n̶g̶e̶=̶"̶a̶n̶g̶u̶l̶a̶r̶.̶e̶l̶e̶m̶e̶n̶t̶(̶t̶h̶i̶s̶)̶.̶s̶c̶o̶p̶e̶(̶)̶.̶v̶m̶.̶p̶r̶e̶U̶p̶l̶o̶a̶d̶(̶$̶i̶n̶d̶e̶x̶)̶;̶"̶ 
       onchange="angular.element(this).scope().$parent.$eval('vm.preUpload($index)');"
       ng-image-compress
    />
</div>

The ng-image-compress directive uses an isolate scope. The vm object is not passed to that isolate scope.