Anil
Anil

Reputation: 1778

agm snazzy info window styles not getting changed

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,

enter image description here

The background color is not Orange. Please correct me where I am going wrong.

Upvotes: 1

Views: 1537

Answers (1)

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

Related Questions