CODEWITHSUNDEEP
google-mapsangulartypescript
Sireini
Sireini

Reputation: 4262

angular 2 write a ngIf statement by output of a function

I am working with sebm angular 2 google maps library, I have a function of the zoomChange event like this: <sebm-google-map (zoomChange)="testFunction($event)"></sebm-google-map>

and in my component this is the function:

testFunction(e){
    console.log('test', e);
}

Want to write an ngIf statement to show a specific marker when zoom level is 18:

<sebm-google-map-marker *ngFor="let clustermarker of clusters" 
                        (markerClick)="clustermarkerClicked()" 
                        [latitude]="clustermarker.latitude" 
                        [longitude]="clustermarker.longitude" 
                        [iconUrl]="clustermarker.icon">
</sebm-google-map-marker>

Than an other question is how do I chain an zoom in event to markerClick event

Upvotes: 0

Views: 416

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657741

Set a property to the zoom level

constructor(cdRef: ChangeDetectorRef) {}

testFunction(e){
    this.zoomLevel = e;
    this.cdRef.detectChanges();
    console.log('test', e);
}

Show the component when the zoom level matches:

<ng-container *ngIf="zoomLevel == 18">
  <sebm-google-map-marker *ngFor="let clustermarker of clusters" (markerClick)="clustermarkerClicked()" [latitude]="clustermarker.latitude" [longitude]="clustermarker.longitude" [iconUrl]="clustermarker.icon"></sebm-google-map-marker>
</ng-container>

Upvotes: 2

Related Questions