グーグルのマップのズームイベントにngClassを使用して結合いいえマッピングし

Question

私はこれがあります。

<i [ngClass]="{'active': isGeoLocationButtonEnabled }" class="toggle fa fa-crosshairs" > 

をハンドラは次のとおりです。

private onStartZoomEvent(event) { 
    if (event.zoom != 12) { 
     console.log("Current zoom level is: ", event.zoom); 
     this._eventAggregator.trigger(new DisableGeolocationEvent()); 
     this.disableGeolocationButton(); 
    } 
} 

次のようになりますがトリガーされるイベント：

private mapZoomChangedHandler() { 
    this._mapsWrapper.getMap().then((map: google.maps.Map) => { 
     let zoom = map.getZoom(); 
     this._eventAggregator.trigger(new MapStartZoomEvent(zoom)); 
    }); 
} 

私はこのように購読しています：

this._eventAggregator.subscribe(MapStartZoomEvent, this.onStartZoomEvent.bind(this)); 

初めてマップズームを変更すると、ボタンが無効にならないという問題があります。 2回目にクリックすると、無効になります。私がデバッグすると、すべてが正常であるように見えます。私のブーリアンisGeoLocationButtonEnabledはfalseに設定されていますが、アクティブなクラスはそのままです（バックグラウンドカラーの強調表示です）。

Answer 1

isGeoLocationButtonEnabledが更新された場所は表示されません。 Google MapsコードがAngularsゾーン外で動作することは間違いありません。その検出を変更Angularsゾーン内部モデルを更新するコードを実行するための

使用zone.run(...)は、あなたが `isGeoLocationButtonEnabled`プロパティを初期化するにはどうすればよい（どこで）その後

constructor(private zone:NgZone) {} 

methodWhereEnabledIsUpdated() { 

    ... 
    this.zone.run(() => { 
    isGeoLocationButtonEnabled = someValue; 
    }); 
    ... 
}