Angular2 - после срабатывания маркера события SebmGoogleMapMarkerClick представление не обновляется

У меня есть массив, который выглядит так:

    locations: marker[] = [
    {id: '1',  lat: 51.5239935252832,    lng:  5.137663903579778,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker.png'},
    {id: '2',  lat: 51.523853342911906,  lng:  5.1377765563584035,  content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '3',  lat: 51.5237298485607,    lng:  5.137969675407476,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '4',  lat: 51.52355628836575,   lng:  5.138066234932012,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '5',  lat: 51.52340275379578,   lng:  5.138211074218816,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '6',  lat: 51.523199152806626,  lng:  5.138382735595769,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png' },
    {id: '7',  lat: 51.5229955509073,    lng:  5.138511481628484,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '8',  lat: 51.52280529912936,   lng:  5.138543668136663,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '9',  lat: 51.523596340777075,  lng:  5.138463201866216,   content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '700',lat: 51.523372714362736,  lng:  5.1386992362595265,  content: 'Kids Jungalow (5p)', iconUrl: 'img/marker2.png'},
    {id: '101', lat: 51.52329594683302,  lng:  5.138838711128301,   content: 'Kids Jungalow Giraffe', iconUrl: 'img/marker2.png'}
];

Если я нажму на маркер, откроется раздел с информацией о выбранном маркере.

Здесь html googlemaps:

<sebm-google-map-marker *ngFor="let location of locations" (markerClick)="updateDiv(location)"></sebm-google-map-marker>

Здесь функция updateDiv():

updateDiv(location: Location) {
    this.selectedLocation = location;
}

Вот разметка div, где я хочу отобразить идентификатор locations

<div *ngIf="selectedLocation" class="result-number">{{ selectedLocation.id }}</div>

Но похоже не работает!


typescript angular angular2-changedetection
person Sireini    schedule 27.05.2016    source источник
comment
Вы проверили, что updatDiv() вызывается?   -  person Günter Zöchbauer    schedule 27.05.2016

Ответы (1)


arrow_upward
1
arrow_downward

Вы можете попытаться явно вызвать метод detectChanges класса ChangeDetectorRef:

constructor(private cdr:ChangeDetectorRef) {
}

(...)

updateDiv(location: Location) {
  this.selectedLocation = location;
  this.cdr.detectChanges();
}

Сначала проверьте, действительно ли метод вызывается с правильным location, а selectedLocation обновляется в классе TypeScript.

Если это не сработает, вы можете использовать NgZone:

constructor(private ngZone:NgZone) {
}

(...)

updateDiv(location: Location) {
  this.ngZone.run(() => {
    this.selectedLocation = location;
  });
}

Обработка может быть запущена изначально из объекта (карты Google), который создан вне области действия компонента Angular2...

person Thierry Templier    schedule 27.05.2016