How to pass variable to a function call in angular forEach

Question

I am using a leaflet Directive to show maps on openStreet map.To list all markers my code looks like this :

$scope.goTo = function() {
    restAPI.getSomething().success(function(data) {
        var anArray = data.lists;
        console.log(anArray);
        var anotherList = {};
        angular.forEach(anArray, function(value, key) {
            if (value.geolocation) {
                $scope.project = value;
                anotherList[anArray[key].ao] = {
                    lat: value.lat,
                    lng: value.lng,
                    focus: false,
                    draggable: false,
                    icon: icon,
                    message: '<button type="button" ng-click="openProject(project)">' + value.ao + '</button> {{project.ao}}',
                    clickable: true
                }
            }
        });
        $scope.map.anotherList = anotherList;
    });
}

Here in that message template i am adding a button with a function call, As i understood to pass a variable in template, Scope is the solution, but here, on all markers value.ao name is different but project.ao is same ...(why ????)

when i click on each marker its opening last project in array(anArray).

How can i bind scope value in each iteration ?,So i can open correct project on each marker

You should turn `$scope.project` into an array, so that in every iteration of the `forEach` loop you could assign a different value (i.e. `$scope.project[key]=value`), then use that in your message strings as well. Otherwise your `$scope.project` is logically going to point to the last element in your array as you well described. That is indeed what you programmed. — Edwin Dalorzo, Feb 17 '15 at 13:23
Hi Edwin, Thanks for your time, I changed projected to array, but i am kind of lost in using that key value in message string, i tried like project(key), it dint work — mahi, Feb 17 '15 at 13:48
I suppose it must be something like `ng-click='openProject(project[' + key + '])'`. So that it produces a string like `'openProject(project[0])'`, and in the next iteration `'openProject(project[1])'` and so on, and so on. You must make sure the key (i.e. array index) is hardcoded in the string for that particular iteration. — Edwin Dalorzo, Feb 17 '15 at 14:11

score 0 · Answer 1 · answered Feb 18 '15 at 08:17

my working solution looks like:

$scope.goTo = function() {
    restAPI.getSomething().success(function(data) {
        var anArray = data.lists;
        console.log(anArray);
        var anotherList = {};
        $scope.project = {};
        angular.forEach(anArray, function(value, key) {
            if (value.geolocation) {
                $scope.project[key] = value;
                anotherList[anArray[key].ao] = {
                    lat: value.lat,
                    lng: value.lng,
                    focus: false,
                    draggable: false,
                    icon: icon,
                    message: '<button type="button" ng-click="openProject('+key+')">' + value.ao + '</button> {{project.ao}}',
                    clickable: true
                }
            }
        });
        $scope.map.anotherList = anotherList;
    });
}

$scope.openProject = function(key){
   var project = $scope.project[key];
   // this is how i got correct project
}

Thanks to Edwin for pointing out to pass key value.

How to pass variable to a function call in angular forEach

1 Answers1