Peta Google menunjukkan Kesalahan Tidak Tertangkap: 10 $digest() iterasi tercapai. Membatalkan!; aplikasi sudut

Saya mencoba membuat peta dengan aplikasi sudut saya untuk menunjukkan koordinat di peta. Koordinat ini diperoleh dari api saya dan ditampilkan pada halaman detail. Tapi kode HTML memberi saya kesalahan:

Kesalahan Tak Tertangkap: 10 $digest() iterasi tercapai. Dibatalkan!

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>

Semua kode ini menunjukkan kesalahan di atas. Bagaimana cara memperbaikinya? di bawah ini adalah javascript saya, secara keseluruhan saya memiliki daftar tempat, kemudian pengguna mengklik tempat tersebut dan detail tempat tersebut. Halaman ini juga memungkinkan pengguna untuk menambahkan kategori ke halaman. Jadi inilah seluruh Pengontrol yang tertaut ke halaman tempat peta ini berada.:

 $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();
});

person Roxci William    schedule 14.08.2014    source sumber


Jawaban (2)


Saya rasa Anda tertarik dengan Google Maps dengan Angularjs.

Saya menyarankan alternatif, ng-map, seperti yang saya sarankan di sini Google Maps untuk AngularJS

Dengan ngMap, saya dapat memenuhi kebutuhan Anda dengan mudah dan Anda tidak perlu tahu tentang opsi arahan dan instruksi.

<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>

Contoh di sini!

person allenhwkim    schedule 14.08.2014
comment
Saya sangat baru mengenal sudut, bisakah Anda memberi tahu saya lebih detail bagaimana cara melakukan ini? Yang saya inginkan hanyalah koordinat ditampilkan di peta, koordinat ini sudah ada di halaman saya melalui api saya, saya hanya ingin menunjukkannya di peta, itu saja yang saya inginkan - person Roxci William; 15.08.2014
comment
Bagaimana saya bisa meletakkan variabel saya sendiri di center= jika saya menggunakan pendekatan ngmap - person Roxci William; 15.08.2014
comment
Berikut adalah contoh untuk memperbarui pusat. plnkr.co/edit/UMQVVXtCB4AhzE4uoQK7?p=preview. Saya memperbarui jawabannya - person allenhwkim; 15.08.2014
comment
Plunkr itu memperbarui nilai yang Anda tambahkan, saya ingin variabel saya berasal dari sudut yang sudah ada di halaman dalam bentuk {{lat}},{{lng}}. Saya ingin nilai-nilai ini menjadi pusatnya - person Roxci William; 15.08.2014
comment
Seperti ini, plnkr.co/edit/sE3N4mPoubjdko9chks6?p=preview? Atau ini, plnkr.co/edit/33cZZPBZOkB7TiACTZ9Z?p=preview? Bagaimanapun. Anda dapat memperbarui pusat, - person allenhwkim; 15.08.2014

Sejauh yang saya lihat, tidak ada masalah dengan html Anda. Kesalahan ini terjadi saat Anda membuat perulangan melingkar seperti saat Anda memperbarui variabel yang diawasi dan dalam fungsi peristiwa yang dipicu Anda memperbaruinya lagi.

Bisakah Anda mengedit pertanyaan Anda dan menunjukkan javascript Anda kepada kami?

person Polochon    schedule 14.08.2014