AngularJS compare objects of scope outside ng-repeat - php

Question

Below code of $scope.Deelnemers.
Example: I have two Users / Deelnemers ID 1 and 2 via API from Mysql-db.
App.js
getDeelnemers(){
$http({
method: 'POST',
url: 'api.php?users=users',
data: {}
}).then(function successCallback(response) {
$scope.Deelnemers = response.data;
console.log('Deelnemers: ',$scope.Deelnemers);
}, function errorCallback(response) {
alert('Fout met ophalen sponsors!');
});
};
<div class="row" ng-repeat="Deelnemer in Deelnemers">
<div class="col-md-1">
<input name="id" class="form-control input-sm" value="{{Deelnemer.deelnemer_id}}" type="text" disabled>
</div>
<div class="col-md-3">
<input name="names" class="form-control input-sm" value="{{Deelnemer.naam}}" type="text" disabled>
</div>
<div class="col-md-1">
<input name="groupsnr" class="form-control" ng-model="Deelnemer.groupnr" ng-change="saveAssingDeelnemerGroupnr(Deelnemer.groupnr,Deelnemer.deelnemer_id)"></input>
</div>
<div class="col-md-3" ng-init="getSponsorName(Deelnemer.sponsor)">
{{ SponsorName }}
</div>
</div>
I would like to show the Sponsorname with a getter getSponsorName(Deelnemer.sponsor).
For User ID 1, Deelnemer.sponsor = 987 and for User ID 2, Deelnemer.sponsor = 789
$scope.getSponsorName = function(SponsorId) {
if(SponsorId == 987) {
$scope.SponsorName = "Foo";
}
if(SponsorId == 789) {
$scope.SponsorName = "Bar";
}
}
Output of {{ SponsorName }} is for both users "Bar" while Deelnemer.sponsor for both is different?
I guess it's something simple what I'm doing wrong but I don't see/know it.
Thanks in advance.

Answer 1

You are getting the same value because you are using the same model for all rows,Try the following
html
<div class="col-md-3" ng-init="getSponsorName(Deelnemer)">
{{ Deelnemer.SponsorName }}
</div>
js
$scope.getSponsorName = function(Deelnemer) {
if(Deelnemer.SponsorId == 987) {
Deelnemer.SponsorName = "Foo";
}
if(Deelnemer.SponsorId == 789) {
Deelnemer.SponsorName = "Bar";
}
}