How to render info window content dynamically

Question

I'm using the agm-direction package to display route information on the agm-map (https://www.npmjs.com/package/agm-direction).

I would like to know how I can render the content of the infowindow for especially the origin marker:

the output looks like this:

I would like to do something like this, so I can build a more complex infowindow:

Answer 1

using agm-info-window you can put your dynamic text into agm-info-window

 <agm-map [latitude]="lat" [longitude]="lng">

      <agm-marker [latitude]="lat" [longitude]="lng">

        <agm-info-window>
          <h3><strong>Howdy!</strong></h3>
          <p>You are here!</p>
        </agm-info-window>

      </agm-marker>

    </agm-map>

Answer 2

Infowindow is string, so if you want to process your variables than write it within `` See Below example

`<h1>${vehicles[0].name}</h1>`