<table class="table table-bordered">
<tr ng-repeat="x in AppliedJob">
<td>{{x.JobName}}</td>
<td> <span class="dropdown" ng-repeat="y in AppliedCenter| unique: 'Location' " ng-if="y.JobName==x.JobName">
{{$index+1}}){{y.Location}}
</span> </td></tr> </table>
Output of above code
1) Tester : 1)India 2)USA 3)Australia
2) Developer : 4)Japan 5)China
Required Output
1) Tester : 1)India 2)USA 3)Australia
2) Developer : 1)Japan 2)China
I want to set $Index
to 1
.
It happens because you're filtering using ng-if
which is not affect array and it's indexes, it just removes the element from DOM. You should use filter instead of y.JobName==x.JobName
comparison in ng-if
so yours ng-repeat
expression should be like this y in AppliedCenter | unique: 'Location' | filter: { JobName: x.JobName }
. See example:
angular
.module('Test', [])
.controller('TestController', ['$scope', function($scope) {
$scope.cities = ["New York", "LA"];
$scope.jobs = [{ name: "QA", city: "New York"}, { name: "Frontend", city: "New York"}, {name: "Backend", city: "New York"}, {name: "DBA", city: "LA"}, { name: "QA", city: "LA"}];
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<div ng-app="Test">
<div ng-controller="TestController">
<table>
<tr ng-repeat="city in cities">
<td ng-bind="city"></td>
<td>
<span ng-repeat="job in jobs | filter:{city: city}">{{($index + 1) + ")" + job.name}} </span>
</td>
</tr>
</table>
</div>
</div>