通过 angular-google-maps 以编程方式触发搜索框 'places_changed' 事件的语法是什么？

Question

我需要以编程方式触发 angular-google-maps 搜索框的 places_changed 事件，而不是手动按 enter。我该如何实现？

我尝试使用 vanilla js 解决方案：

google.maps.event.trigger(searchbox, 'places_changed');

但我不确定要发送什么作为第一个参数。

这是我的标记：

<ui-gmap-google-map center='map.center' zoom='map.zoom' draggable="true" options="map.options" control="map.control">
    <ui-gmap-search-box template="searchbox.template" events="searchbox.events" position="'TOP_LEFT'">
    </ui-gmap-search-box>
</ui-gmap-google-map>

这是我的控制器代码：

$scope.map = { 中央： { 纬度：45，经度：-73 }, 缩放：8 }; $scope.map.control = {}; $scope.map.options = { 滚轮：真 };

    var events = {
        places_changed: function(searchBox) {
            console.log("Search Box :", searchBox.getPlaces());
            var location = searchBox.getPlaces();
            console.log("Location :", location[0].geometry.location["G"]);
            var geoKeys = Object.keys(location[0].geometry.location);
            console.log("Keys :", geoKeys);
            $scope.map["center"]["latitude"] = location[0]["geometry"]["location"][geoKeys[0]];
            $scope.map["center"]["longitude"] = location[0]["geometry"]["location"][geoKeys[1]];
            uiGmapIsReady.promise(1).then(function(maps) {
                $timeout(function() {
                    console.log("Map :", $scope.map.control.getGMap());
                    console.log("Bounds :", $scope.map.control.getGMap().getBounds());
                    if (location[0].geometry.viewport) {
                        $scope.map.control.getGMap().fitBounds(location[0].geometry.viewport);
                    } else {
                        $scope.map["zoom"] = 15;
                    }
                    var marker = [{
                        coordinates: {
                            latitude: $scope.map["center"]["latitude"],
                            longitude: $scope.map["center"]["longitude"]
                        },
                        title: location[0]["name"],
                        id: location[0]["id"],
                        icon: location[0]["icon"]
                    }];
                    $scope.randomMarkers = marker;
                    console.log("Random Markers :", $scope.randomMarkers);
                });
                console.info("Google Maps ready", $scope.map);

            });
            //$scope.map.fitBounds(location[0].geometry.viewport);
        }
    }

    $scope.searchbox = {
        template: 'app/user/editProfile/map-search.html',
        events: events
    };

现在我需要通过页面其他地方的 ng-click 触发 "places_changed" 事件。我该如何实现？

提前致谢。

Answer 1

使用它来触发搜索框上的输入键事件，它会产生相同的结果。编辑 1 - google.maps.event.trigger 在 google API 通过 angular 加载后可用。这就是我在自己的应用程序中使用它的方式：

uiGmapIsReady.promise(1).then(function(instances) {
        instances.forEach(function(inst) {
            // run the searchbox with the input provided
            $timeout(function() {
                var input = angular.element("#" + 'id_of_searchBox')[0];
                google.maps.event.trigger(input, 'focus')
                google.maps.event.trigger(input, 'keydown', {
                    keyCode: 13
                });
            }, 100);
        });
    });

通过 angular-google-maps 以编程方式触发搜索框 'places_changed' 事件的语法是什么？

What is the syntax to trigger searchbox 'places_changed' event programmatically via angular-google-maps?

google-maps

angularjs

angular-google-maps