2

.controller('MapCtrl', [
    '$scope', '$http', '$location', '$window',
 
function ($scope, $http, $location, $window) {
    $http.get('****').success(function (data, dealers, response) {
        function initialize() {
            var serverData = data;
            $scope.locations = [];
            for (var i = 0; i < serverData.length; i++) {
                var modal = [
                data[i].Store_Name, data[i].S_Location.Latitude, data[i].S_Location.Longitude, i, 'images/arrow.svg', data[i].S_Address];
                $scope.locations.push(modal); 
            }
            console.log($scope.locations);
            //---------------------------------------------------------
            //console i am getting like this
            var locations = [
                ['nokia store', '12.971599', '77.594563', '1', 'images/arrow.svg.svg', '55a78953815356700bee698f'],
                ['samsung store', '12.9065534', '77.5774802', '2', 'images/arrow.svg.svg', '55a786d1815356700bee6982'], ];
            //----------------------------------------------------------
            var map = new google.maps.Map(document.getElementById('map'), {
                zoom: 13,
                center: new google.maps.LatLng(12.9667, 77.5667),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });
            var infowindow = new google.maps.InfoWindow();
            var marker, i;
            for (i = 0; i < $scope.locations.length; i++) {
                //console.log($scope.locations[i][1]);
                marker = new google.maps.Marker({
                    position: new google.maps.LatLng($scope.locations[i][1], $scope.locations[i][2]),
                    map: map,
                    icon: $scope.locations[i][4],
                    animation: google.maps.Animation.DROP,
                });
                google.maps.event.addListener(marker, 'click', (function (marker, i) {
                            return function() {
			//console.log($scope.locations[i][8]);

	  var compiled = $compile('<button ng-click="navigate('+$scope.locations[i][5]+')">Navigate</button>')($scope);

			var infowindow = new google.maps.InfoWindow({content: compiled[0]});
         	

          infowindow.open(map, marker);
		   $scope.$apply();
		   
        }
                })(marker, i));
            }
            $scope.map = map;
        }
        $scope.navigate(id) {
            console.log(id);
        }
    });

when i click icon im getting error in console like this

Error: [$parse:syntax] Syntax Error: Token 'b24782c7d354f30cda0e89' is unexpected, expecting [)] at column 12 of the expression [navigate(55b24782c7d354f30cda0e89)] starting at [b24782c7d354f30cda0e89)]. http://errors.angularjs.org/1.3.13/$parse/syntax?p0=b24782c7d354f30cda0e89&p1=is%20unexpected%2C%20expecting%20%5B)%5D&p2=12&p3=navigate(55b24782c7d354f30cda0e89)&p4=b24782c7d354f30cda0e89) at REGEX_STRING_REGEXP (http://localhost:8100/bower_components/angular/angular.js:63:12) at Parser.throwError (http://localhost:8100/bower_components/angular/angular.js:12011:11) at Parser.consume (http://localhost:8100/bower_components/angular/angular.js:12053:12) at Parser.functionCall (http://localhost:8100/bower_components/angular/angular.js:12323:10) at Parser.primary (http://localhost:8100/bower_components/angular/angular.js:11995:24) at Parser.unary (http://localhost:8100/bower_components/angular/angular.js:12271:19) at Parser.multiplicative (http://localhost:8100/bower_components/angular/angular.js:12254:21) at Parser.additive (http://localhost:8100/bower_components/angular/angular.js:12245:21) at Parser.relational (http://localhost:8100/bower_components/angular/angular.js:12236:21) at Parser.equality (http://localhost:8100/bower_components/angular/angular.js:12227:21) (anonymous function) @ angular.js:11607$get @ angular.js:8557invokeLinkFn @ angular.js:8221nodeLinkFn @ angular.js:7729compositeLinkFn @ angular.js:7078publicLinkFn @ angular.js:6957(anonymous function) @ controllers.js:630S.trigger @ main.js:20(anonymous function) @ VM11388:37(anonymous function) @ VM11381:10L.ff @ VM11381:195L.Dk @ VM11381:195S.trigger @ main.js:20eb @ main.js:22S.trigger @ main.js:20L.Sk @ VM11381:65(anonymous function) @ main.js:21

1 Answer 1

1

The parse error you are getting $parse error because your locations[i][5] variable contains a string and you are directly putting that string in navigate function after evaluation it becomes like ng-click="navigate(55a78953815356700bee698f)" so while compiling div it throws error while parsing that div it will throw an error.

You could solve this by refering scope variable inside that button with index.

Code

$compile('<button ng-click="navigate(locations['+i+'][5])">Navigate</button>')($scope);
Sign up to request clarification or add additional context in comments.

1 Comment

@sreemohan Glad to hear that..Glad to help you.. Booomm & Cheers :) Thanks :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.