angularjs
  • google-maps
  • ng-map
  • 2017-02-20 23 views 1 likes 
    1

    Я пытаюсь использовать ng-карту для динамического отображения нескольких маркеров следующим образом.Невозможно отобразить несколько маркеров с помощью ng-map

    <div class="panel-body" style="height:300px"> 
         <map ng-transclude class='google-map' center='map.center' zoom="map.zoom"> 
          <marker ng-repeat="pos in tabledata" position="{{pos.lat}}, {{pos.lng}}"></marker> 
         </map> 
        </div> 
    

    Код контроллера выглядит следующим образом.

    $http({ 
         method: "GET", 
         url: "http://xx.xxx.x.xx:3000/abc", 
         params:{parameters} 
        }).then(function(success){ 
         $scope.tabledata = success.data; 
        },function(error){ 
         console.log('error ' + JSON.stringify(error)); 
        }); 
    

    Я получаю ошибку, как Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{pos.lat}}, {{pos.lng}}] starting at [{pos.lat}}, {{pos.lng}}].

    +0

    Что такое success.data? Вы можете показать нам console.log (успех); – hurricane

    +0

    success.data is [{"lat": "12.32323", "lng": "67.45342"}, {"lat": "12.7777777", "lng": "56.12335235"}, {"lat": "14.3452323" , "lng": "56.88888"}] –

    +0

    Вы можете использовать мой ответ. – hurricane

    ответ

    2

    У вас есть синтаксические ошибки в использовании углового на,

    position="{{pos.lat}}, {{pos.lng}}" должен быть position="{{[pos.lat, pos.lng]}}"

    <marker ng-repeat="pos in tabledata" position="{{pos.lat}}, {{pos.lng}}"></marker>

    Эта линия должна быть,

    <marker ng-repeat="pos in tabledata" position="{{[pos.lat,pos.lng]}}"></marker>

    Таким образом, код будет,

    <div class="panel-body" style="height:300px"> 
         <map ng-transclude class='google-map' center='map.center' zoom="map.zoom"> 
          <marker ng-repeat="pos in tabledata" position="{{[pos.lat, pos.lng]}}"></marker> 
         </map> 
        </div> 
    

    HERE IS AN EXAMPLE

    +0

    Но я получаю сообщение об ошибке: [$ parse: синтаксис] Синтаксическая ошибка: токен ',' является неожиданным токеном в столбце 8 выражения [pos.lat, pos.lng], начиная с [, pos.lng] после создания выше изменение. –

    +0

    try, '' – Sravan

    +0

    @SatyaNarayana, проверьте мой обновленный ответ. – Sravan

    0

    Данные позиции должны выглядеть следующим образом:

    pos = [40.71, -73.21] 
    

    Так вы необходимо преобразовать данные в определение массива. Добавьте эту функцию к контроллеру:

    $scope.getCoordinates = function(oldPos){ 
        var newPos : [oldPos.lat,oldPos.lng]; 
        return newPos; 
    } 
    

    и использовать его в положении:

    <marker ng-repeat="pos in tabledata" position="getCoordinates(pos)"></marker> 
    
    +0

    Я использовал this.getCoordinates = function (oldPos) {return [oldPos.lat, oldPos.lng];} в функции контроллера и изменен маркерный тег как . Я получаю сообщение об ошибке: [$ rootScope: infdig] 10 $ digest() итераций. Aborting! Наблюдатели, уволенные в последние 5 итераций: [[{"msg": "fn: regularInterceptedExpression", "newVal": ["12.32323", "67.45342"], "oldVal": ["12.32323", "67.45342"]} .... –

    +0

    @SatyaNarayana в контроллере строка поворота для float – hurricane

    +0

    Повторяется одна и та же проблема. Ошибка: [$ rootScope: infdig] Достигнуто 10 $ digest(). Aborting! Наблюдатели за последние 5 итераций: [[{"msg": "fn: regularInterceptedExpression", "newVal": [12.32323,67.45342], "oldVal": [12.32323,67.45342]} –

     Смежные вопросы

    • Нет связанных вопросов^_^