Question

使用角度框架时，如何向谷歌地图“中心”添加坐标。我用

在我的页面上替换了坐标

coordinates: <td>{{lat}},{{lng}}</td>

我有下面的代码不起作用，我哪里错了？

<google-map center="map.center" zoom="zoom" draggable="true" options="options">

我用这个

得到以下错误

错误：[$ parse：syntax]

语法错误：令牌'纬度'位于表达式[{3}]的第{2}列，从[{4}]开始。   下面是获取坐标值的控制器：

.controller('UncatCtrl', function ($scope, $http, $routeParams) {

$http.get('http://94.125.132.253:8000/getuncategorisedplaces').success(function (data, status, headers) {

    $scope.places = data;
    console.log(data);
    $scope.message = 'Uncategorised places';
})
$scope.id = $routeParams.id;
$scope.showplace = function(id) {
  $http({method: 'GET', url: 'http://94.125.132.253:8000/getitemdata?ID=' + $scope.id}).
      success(function(data, status, headers, config) {
          $scope.place = data;               //set view model
          console.log(data);

          console.log(id);

           $scope.view = 'templates/detail.html';
          console.log(data.place.lat);
  $scope.map =
{
center: {
  latitude : data.place.lat,
   longitude : data.place.lng,

 },
zoom: 13,

}

Answer 1

请尝试这样：在你的控制器上创建一个变量，它将保存属性的整个字符串值，然后绑定到它。

$scope.centerCoords = '[{latitude:' + $scope.latitude + '},longitude:{'+ $scope.latitude + '}]'

（我不熟悉谷歌地图sintax，所以请原谅我，如果上面的代码不准确，只要修复它，如果是这样的话）

然后像这样绑定它：

<google-map center="{{centerCoords}}" zoom="zoom" draggable="true" options="options">

顺便说一句，google-map是一个自定义指令吗？

Answer 2

试试这个：<google-map center="[{latitude:{{latitude}},longitude:{{longitudes}}}]" zoom="zoom" draggable="true" options="options">

Answer 3

AngularJS Google Map指令的工作方式不会在center属性中评估您的表达式。有关详细信息，请参阅official documentation并修复代码，执行以下操作：

 // in your UncatCtrl make the following object
 $scope.map = 
 {
  center: {
   latitude: $scope.latitude, 
   longitude: $scope.longitude 
  }, 
  zoom: 14
 };

 // in your google-map html element use
 <google-map center="map.center" ...></google-map>

这是一个工作小提琴 http://jsfiddle.net/hpeinar/m8n9x5xn/

在角度应用中添加坐标到谷歌地图

3 个答案: