当前位置 : 首页 » 互动问答 » 正文

agm-marker onMouseOver打开agm-info-window

分类 : 互动问答 | 发布时间 : 2017-10-03 17:44:03 | 评论 : 2 | 浏览 : 1270 | 喜欢 : 4

I using Angular Google Maps(AGM)及部件。 我需要打开标记鼠标悬停的信息窗口。 如何在我的函数infowindow中检索onMouseOver实例以打开它<angularjs =“ “15”>     <agm-marker * ngFor =“let m of markers; let i = index”                 [纬度] = “m.geoCode.latitude”                 [经度] = “m.geoCode.longitude”                 (鼠标悬停)= “的onMouseOver(M)”                 >         <agm-info-window [disableAutoPan] =“false”>             <DIV>                 <a (click)="onClickInfoView({id:m.id})" class="btn btn-attention pull -right"> test <i class =“fa fa-angle-double-right”> </ i> </A>             </ DIV>         </ AGM-信息窗口>     </ AGM-标记> </ AGM-地图> onMouseOver(data){         ???? / *如何在这里打开信息窗口?     }

<agm-map [fitBounds]="latlngBounds" [zoom]="15">
    <agm-marker *ngFor="let m of markers; let i = index"
                [latitude]="m.geoCode.latitude"
                [longitude]="m.geoCode.longitude"
                (mouseOver)="onMouseOver(m)"
                >

        <agm-info-window [disableAutoPan]="false">

            <div>
                <a (click)="onClickInfoView({id:m.id})" class="btn btn-attention pull-right">test<i class="fa fa-angle-double-right"></i></a>
            </div>

        </agm-info-window>


    </agm-marker>

</agm-map>



onMouseOver(data) {
        ???? /* how to open here the info window?
    }

回答(1)

  • 1楼
  • 最后,我找到了一个解决方案:<agraph> <agm-map #gm [fitBounds] =“latlngBounds”[zoom] =“15”>     <agm-marker * ngFor =“let m of markers; let i = index”                 [纬度] = “m.geoCode.latitude”                 [经度] = “m.geoCode.longitude”                 (鼠标悬停)= “的onMouseOver(信息窗口,克)”                 >         <agm-info-window [disableAutoPan] =“false”#infoWindow>             <DIV>                 {{m.name}}                 {{m.rating}}             </ DIV>             <DIV>                 <a (click)="onClickInfoView({id:m.id})" class="btn btn-attention pull-right"> Daje <i class =“fa fa-angle-double-right”> </ i> </A>             </ DIV>         </ AGM-信息窗口>     </ AGM-标记> </ AGM-地图> onMouseOver(infoWindow,gm){         if(gm.lastOpen!= null){             gm.lastOpen.close();         }         gm.lastOpen = infoWindow;         infoWindow.open();     }

    <agm-map #gm [fitBounds]="latlngBounds" [zoom]="15">
        <agm-marker *ngFor="let m of markers; let i = index"
                    [latitude]="m.geoCode.latitude"
                    [longitude]="m.geoCode.longitude"
                    (mouseOver)="onMouseOver(infoWindow,gm)"
                    >
    
            <agm-info-window [disableAutoPan]="false" #infoWindow>
    
                <div>
                    {{m.name}}
                    {{m.rating}}
                </div>
                <div>
                    <a (click)="onClickInfoView({id:m.id})" class="btn btn-attention pull-right">Daje <i class="fa fa-angle-double-right"></i></a>
                </div>
    
            </agm-info-window>
    
    
        </agm-marker>
    
    </agm-map>
    
    
    onMouseOver(infoWindow, gm) {
    
            if (gm.lastOpen != null) {
                gm.lastOpen.close();
            }
    
            gm.lastOpen = infoWindow;
    
            infoWindow.open();
        }
    

相关阅读:

Angular 2.0 and Modal Dialog

Google map V3 Set Center to specific Marker

Google Maps JS API v3 - Simple Multiple Marker Example

How to disable mouse scroll wheel scaling with Google Maps API

Google Maps API v3: How to remove all markers?

Google Maps API 3 - 默认(点)标记的自定义标记颜色

Google Map API v3 — set bounds and center

Calculate distance between two points in google maps V3

Google MAP API未捕获TypeError:无法读取null的属性'offsetWidth'

How to use jQuery with Angular?