javascript - Angular JS - Using {{}} in script -
i'm new angular don't know if i'm trying right thing here. if not, please point me in right direction.
what want do:
i'm using json external map data angular-google-maps load in data. json has 100 places, names, latitudes , longitudes. want use angular loop through data , place markers on map each place.
html
<body ng-controller="examplecontroller"> <input type="text" ng-model="data.message"> <li class="places" ng-repeat="place in places"> <p class="link">{{place.name}}</p> <p>{{place.lat}}</p> <p>{{place.lng}}</p> <div class="google-map" center="centerproperty" zoom="zoomproperty" markers="markersproperty" latitude="clickedlatitudeproperty" longitude="clickedlongitudeproperty" mark-click="true" draggable="true" style="height: 500px; width: 80%; "> </div> </li> </body> javascript
(function () { var module = angular.module("angular-google-maps-example", ["google-maps"]); }()); function examplecontroller ($scope, $http) { $http.get('json/map-data.json').success(function(data) { $scope.places = data; }); angular.extend($scope, { /** initial center of map */ centerproperty: { lat: 45, lng: -73 }, /** initial zoom level of map */ zoomproperty: 8, /** list of markers put in map */ markersproperty: [ { latitude: 45, longitude: -74 }], // these 2 properties set when clicking on map clickedlatitudeproperty: null, clickedlongitudeproperty: null, }); } why it's not working
obviously i'm little on head, i'm trying find way {{place.lat}} , {{place.lng}}into markersproperty: in javascript. can somehow push these values markersproperty array? what's best way achieve this?
in javascript, reference them through $scope:
$scope.place.name $scope.place.lat $scope.place.lng
Comments
Post a Comment