[Angular google-maps API]: есть ли способ изменитьatteributes изнутри машинописного кода? - PullRequest
Новая
       3

[Angular google-maps API]: есть ли способ изменитьatteributes изнутри машинописного кода?

0 голосов
/ 10 февраля 2019

Я читаю некоторые маркеры из базы данных и отрисовываю их на Google-maps, используя тег <agm-marker>.

Это часть кода, где я читаю маркеры и помещаю их в массив markers (componentName.component.ts): 

 ngOnInit(): void {


this.markerService.fetchMarkers()

this.markerService.markersSubject.subscribe(markers => {

  markers.forEach(marker => {

    this.markers.push({
      lat: marker.latitude,
      lng: marker.longitude,
      title: marker.title,
      story: marker.story,
      path: marker.img_path
    })

  })

})

    } //onInit

и HTML, где отображаются маркеры.: 

    <agm-map
    [latitude]="latitude"
    [longitude]="longitude"
    [zoom]="zoom"
    [disableDefaultUI]="false"
    [streetViewControl]="false"
    [zoomControl]="false"
    [mapTypeControl]="false"
    [mapTypeId]="'terrain'"
    > 

    <agm-marker id="display-markers"
     *ngFor="let m of markers; let i = index"
      (markerClick)="openModal('marker-content' + i)"
      [latitude]="m.lat"
      [longitude]="m.lng"
      [markerDraggable]="m.draggable"
      [iconUrl]="m.icon" 
      [visible]="true"
      [id]="i"
    </agm-marker>

   </agm-map>

Мне нужно разрешить пользователю очищать все маркеры нажатием кнопки, а это означает, что для атрибута [visible] <agm-marker> должно быть установлено значение False для каждого из маркеров.Как я могу получить доступ к маркерам из файла component.ts и изменить его?

Существуют ли другие способы очистки всех маркеров с карты в Angular?

Не могу найти в Интернете ничего: (

спасибо

1 Ответ

0 голосов
/ 10 февраля 2019

Я не получил вопрос полностью, но я думаю, что вам нужно это:

HTML-шаблон 

...
<agm-marker id="display-markers"
  ...
  [visible]="isMarkersVisible"
  ...
</agm-marker>
...
<button (click)="toggleMarkers()">{{isMarkersVisible ? "Hide" : "Show"}}</button>
...

Ts файл 

...
isMarkersVisible = true;
...
ngOnInit(): void { ... }
...
toggleMarkers(): void {
  this.isMarkersVisible = !this.isMarkersVisible;
}
...

Надеюсь, чтопомогает.

...