javascript - 使用 angular-google-maps 点击隐藏所有信息窗口

Question

我正在使用此处定义的 Angular 谷歌地图 API: https://angular-ui.github.io/angular-google-maps/#!/api

我有以下 DOM 结构

<ui-gmap-markers models="destinationMarkers" coords="'self'" idKey='self.idkey' >
    <div ui-gmap-windows models="destinationMarkers" control="infoWindows">
        <div ng-non-bindable>
            <!-- {{contents}} -->
        </div>
    </div>
</ui-gmap-markers>

我试图做到这一点，以便在单击 map 的任何其他部分或打开另一个窗口时关闭信息窗口。我最接近的是打电话:scope.infoWindows.getChildWindows()它可以访问标记对象，但是调用关联的 hideWindow 函数似乎没有执行任何操作。有谁知道该怎么做吗？

Answer 1

我刚刚遇到了完全相同的问题，经过一番困惑后我有了一个解决方案(抱歉，如果我来晚了一点)

您必须像这样在窗口上设置 Controller 属性...

<ui-gmap-window ng-if="m.response" control="googlemap" >

“googlemap”控件必须是 Scope 的成员，并且“control”必须定义为 map 对象上的空对象，如下所示...

$scope.googlemap = {};

$scope.map = {
    zoom: 5,
    center: getMapCenter(response),
    options: {
        // draggable: false
    },
    control: {}
};

现在我们可以将一个事件附加到标记，这将使我们能够迭代窗口列表并像这样隐藏它们......

markers.push({
    id: i,
    ...
    ...
    events: {
        click: function(e){
            var windows = $scope.googlemap.getChildWindows();

            for (var i = 0; i < windows.length; i++){
                windows[i].hideWindow()
            }
        }
    }
});