角2使用ngUI地圖

Question

這裏是我試過

這是我的代碼：

<ngui-map center="Brampton, Canada"> 
    <marker position="Brampton, Canada" 
     draggable="true" 
     (click)="clicked($event)"> 
    </marker> 
    <info-window id="iw"> 
     lat: [[lat]], lng: [[lng]] 
    </info-window> 
    </ngui-map> 

import { Component } from '@angular/core'; 
import { NguiMapComponent } from '@ngui/map'; 
    @Component({ 
    template: require('./app.html') 
    }) 
    class AppCompoment { 
    clicked(event) { 
     let marker = event.target; 
     marker.ng2MapComponent.openInfoWindow('iw', marker, { 
     lat: marker.getPosition().lat(), 
     lng: marker.getPosition().lng(), 
     }); 
    } 

我收到此錯誤：

Cannot read property 'openInfoWindow' of undefined 

我怎樣才能解決這個問題。

請告訴我。

感謝您使用@ViewChild訪問子組件

Answer 1

嘗試。

<ngui-map center="Brampton, Canada"> 
    <marker #mrker position="Brampton, Canada" 
     draggable="true" 
     (click)="clicked($event)"><!-- set id --> 
    </marker> 
    <info-window id="iw"> 
     lat: [[lat]], lng: [[lng]] 
    </info-window> 
    </ngui-map> 

組件類：

import { Component,ViewChild } from '@angular/core'; 
import { NguiMapComponent } from '@ngui/map'; 
    @Component({ 
    template: require('./app.html') 
    }) 
    class AppCompoment { 
    @ViewChild(NguiMapComponent) 
    ngMap:NguiMapComponent; 

    //@ViewChild('mrker') 
    //marker:any; 

    clicked(event) { 
     let marker = event.target; 
     this.ngMap.openInfoWindow('iw', marker, { 
     lat: marker.getPosition().lat(), 
     lng: marker.getPosition().lng(), 
     }); 
    } 

Answer 2

<ngui-map zoom="14" [center]="center" (mapClick)="onMapClick($event)"> 
    <marker *ngFor="let pos of positions" 
      [position]="pos" (click)="clickedMarker($event)" ></marker> 
    <info-window id="iw"> 
    <div *ngIf="infoposition"> 

     lat: {{ position.coords.latitude }}, lng: {{ position.coords.longitude }} 
    </div> 

    </info-window> 


</ngui-map> 




clickedMarker(event:any) { 
let marker = event.target; 
let lat = marker.getPosition().lat(); 
let lng= marker.getPosition().lng(); 
marker.nguiMapComponent.openInfoWindow('iw', marker); 

}