如何在 Angular 9 中綁定 OpenLayers 中的縮放變化

Question

我正在為我的 openlayers map 尋找一些更改監聽器。

對於一個沒有經驗的Angular的人，我不確定是否應該綁定div更改，或者我不知道如何直接綁定map的部分？ 在這種情況下，如果沒有任何可以設置（更改）或（ngModel）或類似元素的元素，我該如何調用我的 function？

map 正在創建 onInit 調用此 function：

createOpenLayersMap(){
  this.map = new Map({
    target: 'hotel_map',
    layers: [new TileLayer({
      source: new OSM()
    })],
    view: new View({
      center: olProj.fromLonLat([this.lng, this.lat]),
      zoom: 7
    })
  });
  this.crForm = this.fb.group({
  crControl: [1],
  crEndControl: [1]
});
}

map 目標是 id 為“hotel_map”的 div：

CSS：

#hotel_map {
  height: 100%;
  width: 100%;
 }

HTML：

      <div id="hotel_map" (change)="getZoom()"></div>

Typescript function：

  zoomLevel: any = '';
  getZoom(){
  this.zoomLevel = this.map.getView().getZoom();
  console.log(this.zoomLevel)
  }

現在我需要知道用來改變圓半徑的縮放參數。

對於任何解決方案和建議，提前致謝！

Answer 1

this.map.getView().on('change:resolution', () => {
    this.zoomLevel = this.map.getView().getZoom();
    console.log(this.zoomLevel)
})

只聽“變化：分辨率”