Reputation: 1778
I am trying to customize the AgmSnazzyInfoWindow that will appear when i click on a marker.
In my HTML file, I have the following code,
<agm-snazzy-info-window [maxWidth]="800" [closeWhenOthersOpen]="true" [backgroundColor]="orange">
<ng-template>
<mat-card>{{ pLocationId }} {{ pLocationName }}</mat-card>
<mat-nav-list>
<mat-list-item>
</mat-list-item>
</mat-nav-list>
</ng-template>
</agm-snazzy-info-window>
Here according to the properties, the background color of the info should be orange but I am not getting the expected result.
Here is the info-window I am getting,
The background color is not Orange. Please correct me where I am going wrong.
Upvotes: 1
Views: 1537
Reputation: 11
Try to write the backgroundColor input without brackets. If you write them, angular looks for variables/functions from your controller instead of taking the literal value.
The following code should work:
<agm-snazzy-info-window [maxWidth]="800" [closeWhenOthersOpen]="true" backgroundColor="orange">
<ng-template>
<mat-card>{{ pLocationId }} {{ pLocationName }}</mat-card>
<mat-nav-list>
<mat-list-item>
</mat-list-item>
</mat-nav-list>
</ng-template>
</agm-snazzy-info-window>
Upvotes: 1