Карты Google, показывающие Uncaught Error: достигнуто 10 итераций $digest(). Прерывание!; угловое приложение

Я пытаюсь создать карту с моим угловым приложением, чтобы показать координаты на карте. Эти координаты получены из моего API и отображаются на подробной странице. Но код HTML дает мне ошибку:

Неперехваченная ошибка: достигнуто 10 итераций $digest(). Прерывание!

HTML:

<input  value="{{place.place.name}}">


<label>zoom</label>
<input type="number" ng-model="zoom"/>

<div id="map_canvas">
<google-map center="{latitude: place.place.lat,longitude: place.place.lng}" zoom="zoom" draggable="true" options="options">
  <marker coords="{latitude: place.place.lat,longitude: place.place.lng}"></marker>
</google-map>

</div>

Весь этот код показывает указанную выше ошибку. Как я могу это исправить? ниже мой javascript, в целом у меня есть список мест, затем пользователь нажимает на место и детали места. Страница также позволяет пользователю добавлять категорию на страницу. Итак, вот весь контроллер со ссылкой на страницу, где находится эта карта.:

 $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';

      })
      .error(function(data, status, headers, config) {
          $scope.place = data || "Request failed";
          $scope.status = status;
          $scope.view = 'templates/detail.html';
      });
   }
  $scope.showplace();


      $scope.map = function(){

 $scope.zoom = 13;


  }
$scope.map();
$scope.meta = function () {
    $http.get('http://94.125.132.253:8000/getmetas').success(function (data, status, headers) {

        $scope.metas = data;
        console.log($scope.category);
        console.log(data);
        $scope.message = 'List of Uncategorised places';


    })
}
$scope.meta();
$scope.meta1 = function (data, status, headers) {
    var formdata = {
        'cat': $scope.cat,
    }
    var inserturl = 'http://94.125.132.253:8000/getcategories?meta=' + formdata.cat;
    return $http.get(inserturl).success(function (data, status, headers) {

        $scope.categories = data;
        console.log(formdata.cat);
        console.log(data);

    });
};


$scope.$watch('cat', function (newvalue) {
    $scope.meta1();
});
$scope.meta2 = function (data, status, headers) {
    var formdata = {
        'category': $scope.category,
    }
    var inserturl = 'http://94.125.132.253:8000/getsubcategories?category=' + formdata.category;
    return $http.get(inserturl).success(function (data, status, headers) {

        $scope.subcategories = data;
        console.log(formdata.sub);
        console.log(data);

    });
};

$scope.$watch('category', function (newvalue2) {
    $scope.meta2();
});

google-maps javascript angularjs
person Roxci William    schedule 14.08.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Я думаю, вас интересуют Карты Google с angularjs.

Я предлагаю альтернативу, ng-map, как я предложил здесь Карты Google для AngularJS

С ngMap я могу легко удовлетворить ваши требования, и вам не нужно знать о параметрах директив и инструкциях.

<script>
var MyCtrl = function($scope) {
  $scope.updateCenter = function(lat,lng) {
    $scope.map.setCenter(new google.maps.LatLng(lat, lng));
  }
}
</script>

<body ng-controller="MyCtrl">
  <map center="[40.74, -74.18]"></map>
  <button ng-click="updateCenter(41.74, -75.18)">Update Center</button>
</body>

Пример здесь!

person allenhwkim    schedule 14.08.2014
comment
Я очень новичок в angular, не могли бы вы рассказать мне подробнее, как это сделать? Все, что я хочу, это показать координаты на карте, эти координаты уже присутствуют на моей странице через мой API, я просто хочу показать их на карте, это все, что я хочу - person Roxci William; 15.08.2014
comment
Как я могу поместить свою собственную переменную в центр =, если я использую подход ngmap - person Roxci William; 15.08.2014
comment
Вот пример обновления центра. plnkr.co/edit/UMQVVXtCB4AhzE4uoQK7?p=preview. я обновляю ответ - person allenhwkim; 15.08.2014
comment
Этот plunkr обновляет добавляемые вами значения, я хочу, чтобы мои переменные исходили из angular, которые уже находятся на странице в виде {{lat}}, {{lng}}. Я хочу, чтобы эти значения были в центре - person Roxci William; 15.08.2014
comment
Как это, plnkr.co/edit/sE3N4mPoubjdko9chks6?p=preview? Или это, plnkr.co/edit/33cZZPBZOkB7TiACTZ9Z?p=preview? Так или иначе. вы можете обновить центр, - person allenhwkim; 15.08.2014

arrow_upward
1
arrow_downward

Насколько я вижу, с вашим html проблем нет. Эта ошибка возникает, когда вы создаете циклический цикл, например, когда вы обновляете отслеживаемую переменную, а в функции триггерного события вы снова обновляете ее.

Можете ли вы отредактировать свой вопрос и показать нам свой javascript?

person Polochon    schedule 14.08.2014