title: Opening an info window on an AGM polygon
body: <p>I'm using the Angular Google Maps library and trying to get an <code>agm-snazzy-info-window</code> component to pop up when a polygon object on the map is clicked.  I tried modeling it on the "using the directive with a marker" section of <a href="https://angular-maps.com/guides/snazzy-info-window/custom-info-windows-with-snazzy-info-window/" rel="nofollow noreferrer">this page</a>:</p>
  
  <pre><code>&lt;agm-map [fitBounds]="mapData.bounds"&gt;
      &lt;agm-polygon *ngFor="let polygon of mapData.polygons" [paths]="polygon.points"&gt;
          &lt;agm-snazzy-info-window&gt;
              &lt;ng-template&gt;
                  text goes here
              &lt;/ng-template&gt;
          &lt;/agm-snazzy-info-window&gt;    
      &lt;/agm-polygon&gt; 
  &lt;/agm-map&gt;
  </code></pre>
  
  <p>but that didn't do anything.  I tried doing it programmatically instead:</p>
  
  <pre><code>&lt;agm-map [fitBounds]="mapData.bounds"&gt;
      &lt;agm-polygon *ngFor="let polygon of mapData.polygons; let i = index" [paths]="polygon.points"
          (polyClick)="polyClicked(i, polygon, infoWindow)"&gt;&lt;/agm-polygon&gt; 
      &lt;agm-snazzy-info-window #infoWindow [latitude]="mapData.selectedPoint.lat" [longitude]="mapData.selectedPoint.lng"&gt;
          &lt;ng-template&gt;
              text goes here
          &lt;/ng-template&gt;
      &lt;/agm-snazzy-info-window&gt;    
  &lt;/agm-map&gt;
  
  polyClicked (index: number, polygon, infoWindow: AgmSnazzyInfoWindow) {
      console.log(index, polygon, infoWindow) // this works correctly
  
      // getPolygonCenter returns a LatLngLiteral from the center of a rectangle that fits the points
      this.mapData.selectedPoint = getPolygonCenter(polygon.points)
  
      if (infoWindow.isOpen &amp;&amp; index === this.mapData.polygonIndex) {
          // close the window if it's already open and we're clicking the same polygon again
          infoWindow.isOpen = false
      } else {
          // otherwise open it and save the index of the clicked polygon
          this.mapData.polygonIndex = index
          infoWindow.isOpen = true
      }
  }
  </code></pre>
  
  <p>but that didn't work either.  In both cases the map and polygons display fine, and the <code>console.log</code> in the second one shows the expected info on a click, it just never displays the window.  Am I doing something wrong?  Is there another way to do it?</p>
  
  <p>Note for possible XY problem concerns: The default (non-snazzy) <code>agm-info-window</code> component worked fine here and did almost everything I need. However, I need to be able to add some CSS styling onto it, and couldn't figure out how to do that.  So another solution for that would solve my immediate problem at least.</p>