无法在Angular Google Map中为标记添加窗口

时间:2014-06-11 13:44:45

标签: angularjs google-maps google-maps-api-3 angularjs-directive ionic-framework

我正在尝试将窗口(信息气泡)添加到Angular Google Map中的标记。我正在使用Ionic Framework。

标记:

<google-map
    center="map.center"
    zoom="map.zoom"
  <marker
    ng-repeat="marker in markers"
    coords="marker"
    <window
      show="true"
      templateUrl="templates/map-info-window.html">
    </window>
  </marker>
</google-map>

JS:

  $scope.markers = [];

  $scope.populateMarkers = function(locations) {
    for (var i = 0; i < locations.length; i++) {
      $scope.addMarker(locations[i].Latitude, locations[i].Longitude);
    }
  }

  $scope.addMarker = function (lat, lng) {

    $scope.markers.push({
        latitude: parseFloat(lat),
        longitude: parseFloat(lng)
    });
  }

我想为每个window添加markerAngular GoogleMaps documentation表示您可以在window中加入marker以使用其坐标。

但上面的代码不起作用。对于每个window我尝试添加我得到此错误:

Error: [jqLite:nosel] Looking up elements via selectors is not supported by jqLite! See: http://docs.angularjs.org/api/angular.element
http://errors.angularjs.org/1.2.12/jqLite/nosel
    at http://localhost:8888/anggmaps/www/lib/ionic/js/ionic.bundle.js:9007:12
    at JQLite (http://localhost:8888/anggmaps/www/lib/ionic/js/ionic.bundle.js:11072:13)
    at compile (http://localhost:8888/anggmaps/www/lib/ionic/js/ionic.bundle.js:14439:25)
    at WindowChildModel.buildContent (http://localhost:8888/anggmaps/www/lib/angular-google-maps/dist/angular-google-maps.js:491:24)
    at WindowChildModel.createWindowOptions (http://localhost:8888/anggmaps/www/lib/angular-google-maps/dist/angular-google-maps.js:471:29)
    at WindowChildModel.createGWin (http://localhost:8888/anggmaps/www/lib/angular-google-maps/dist/angular-google-maps.js:1901:30)
    at WindowChildModel.createGWin (http://localhost:8888/anggmaps/www/lib/angular-google-maps/dist/angular-google-maps.js:1822:63)
    at new WindowChildModel (http://localhost:8888/anggmaps/www/lib/angular-google-maps/dist/angular-google-maps.js:1856:16)
    at http://localhost:8888/anggmaps/www/lib/angular-google-maps/dist/angular-google-maps.js:3898:24
    at http://localhost:8888/anggmaps/www/lib/ionic/js/ionic.bundle.js:22538:28 ionic.bundle.js:18364
(anonymous function) ionic.bundle.js:18364
(anonymous function) ionic.bundle.js:15775
(anonymous function) ionic.bundle.js:22541
completeOutstandingRequest ionic.bundle.js:13040
(anonymous function)

当我将窗口推入$ scope.windows数组时会发生这种情况,但它只会在所有窗口被推入数组后抛出该错误,我不知道究竟是哪一刻。

谢谢

更新

我更新了上面的代码,现在似乎是正确的,因为(如果我错了请纠正我):

我不需要$ scope.windows数组。每个marker指令都有一个window指令,所以它已经存在 - 它不像markers in marker,我应该在其中填充markers数组,以便ng-repeat指令迭代通过他们。

现在,我仍然得到错误。怎么了?

PS:

我加载了jQuery以查看是否存在问题,但后来它给了我一个不同的,可能无关的错误:

Error: [$compile:ctreq] Controller 'ionTabs', required by directive 'ngClass', can't be found! 

0 个答案:

没有答案