How i pass latlon based on id in angular js google map

Question

I am new in angular js. I am trying to pass my json lat lon based on id in to google api. My json file structure.

{
 "totalCount":206,
  "deals":[{
       "id":"2",
       "Name":"samir",
       "locations":[{
         "location":"Mundhwa Gaon",
         "address":"Mundhwa Gaon, North Main Road, Pune - 411 001",
          "latLon":"18.53918870,73.90790910"
          },
          "location":"Mundhwa Gaon",
          "address":"Mundhwa Gaon, North Main Road, Pune - 411 001",
          "latLon":"18.53918870,73.90790910"
          },
        ]
      },
      "id":"3",
       "Name":"samir",
       "locations":[{
         "location":"Mundhwa Gaon",
         "address":"Mundhwa Gaon, North Main Road, Pune - 411 001",
          "latLon":"18.53918870,73.90790910"
          },
          "location":"Mundhwa Gaon",
          "address":"Mundhwa Gaon, North Main Road, Pune - 411 001",
          "latLon":"18.53918870,73.90790910"
          },
        ] 
   }]
}

My angular js code

$http({method: 'GET', url: '/api/v1/asas}).success(function(data) {             
            $scope.deal = data.deals;               


if(data.deals[0].hasOwnProperty("locations") && data.deals[0].locations!=null){                         
                var location=$scope.deal[0].locations[0]['latLon'];
                var locationlatlong=location.split(",");
                $scope.map = {center: {latitude: locationlatlong[0], longitude: locationlatlong[1] }, zoom: 4 }
                $scope.options = {scrollwheel: false};
                var markers = [];
                for (var i = 0; i < $scope.deal[0].locations.length; i++) {
                    markers.push(createmarker(i, $scope.deal[0].locations[i]['location'], $scope.deal[0].locations[i]['latLon'],$scope.deal[0].locations[i]['address']))
                }
                $scope.markers = markers;
                if(badBrowser){
                    $scope.rendermap=false; 

                }else{                      
                    $scope.rendermap=true;      

                }
            }                       


        });

Now it only pass 1st deals id location. I try to make when some click on one deal then it pass that deals id locations(lat long). I am using angular js 1.2.23

Answer 1

As i can see, you should use $scope.deal.locations.length; in for loop instead $scope.deal[0].locations.length;

But it would be much better if you provided JSFiddle with your problem.

Answer 2

Fixed this problem .My code

$scope.mapcall = function (deals) { 
        $scope.rendermap=false; 
        $scope.rendermapbtn=false;              
        if(deals.locations!=null){                  
            $scope.rendermapbtn=true;                                   
            var location=deals.locations[0]['latLon'];
            var locationlatlong=location.split(",");
            $scope.map = {center: {latitude: locationlatlong[0], longitude: locationlatlong[1] }, zoom: 4 }
            $scope.options = {scrollwheel: false};
            var markers = [];
            for (var i = 0; i < deals.locations.length; i++) {
                markers.push(createmarker(i, deals.locations[i]['location'], deals.locations[i]['latLon'],deals.locations[i]['address']))
            }
            $scope.markers = markers;
            if(badBrowser){
                $scope.rendermapbtn=false;

            }else{                      
                $scope.rendermapbtn=true;   

            }
        }       
    };