使用API​​ v3在角度上添加动态标记

时间:2015-03-25 19:14:43

标签: javascript angularjs google-maps google-maps-api-3 google-maps-markers

我正在尝试在我的地图控制器中动态添加多个标记,但我无法获取id来迭代并显示我的所有标记,如何设置它以获取所有标记并正确显示它们,我得到的错误是:

标记模型没有指定子项的ID。这是性能所必需的。请指定ID,或将ID重定向到其他键

ShowList.enderecoViagem(viagens_id).then(function (listview) {
            $scope.enderecos = listview;


            uiGmapGoogleMapApi.then(function (maps) {


                $scope.googlemap = {};
                $scope.map = {
                    center: {
                        latitude: $scope.enderecos[0].latitude,
                        longitude: $scope.enderecos[0].longitude
                    },
                    zoom: 14,
                    pan: 1,
                    options: $scope.mapOptions,
                    control: {},
                    events: {
                        tilesloaded: function (maps, eventName, args) {},
                        dragend: function (maps, eventName, args) {},
                        zoom_changed: function (maps, eventName, args) {}
                    }
                };
            });

            $scope.windowOptions = {
                show: false
            };



            $scope.title = "Window Title!";

            uiGmapIsReady.promise() // if no value is put in promise() it defaults to promise(1)
                .then(function (instances) {
                    console.log(instances[0].map); // get the current map
                })
                .then(function () {
                    $scope.addMarkerClickFunction($scope.markers);
                });

           for(var i = 0; i < $scope.enderecos.length; i++) {


               $scope.markers = [];

               $scope.markers.push({
                   id:[i],
                   latitude: $scope.enderecos[i].latitude,
                   longitude: $scope.enderecos[i].longitude
               });
           }

       }    

1 个答案:

答案 0 :(得分:8)

问题在于:

$scope.markers.push({
    id:[i],
    latitude: $scope.enderecos[i].latitude,
    longitude: $scope.enderecos[i].longitude
});

在您指定id属性的位置,您已将其包装在数组速记中[ ]

这只有在您实际访问数组值时才有意义,例如:你在哪里enderecos[i].latitude。或者,如果您尝试将数组传递给id属性,但我非常确定它会期待一个简单的字符串或整数。

只需将其改为此即可。

$scope.markers.push({
    id: i,
    latitude: $scope.enderecos[i].latitude,
    longitude: $scope.enderecos[i].longitude
});