Is it possible to leverage Angular2 template syntax when creating a Google Maps InfoWindow?
My understanding is that this involves passing a component as a template string to the content
property in the constructor object of the InfoWindow
.
If my assumption stands, do I need to stringify the component template? Is this approach feasible?
Below is an illustration of what I believe needs to be done:
// Component
import {Component} from 'angular2/core';
import {Thing} from './something/in/my/app/thing.model.ts';
@Component({
selector: 'my-infowindow',
template: `<p>This is an infowindow for {{ something.name }}</p>`
})
export class MyInfoWindowComponent {
constructor(public something: Thing) {}
}
// Implementation
import {Thing} from './something/in/my/app/thing.model.ts';
import {MyInfoWindowComponent} from './path/to/infowindow.component';
/* { ...stuff... } */
private _buildInfoWindow(thing: Thing): google.maps.InfoWindow {
return new google.maps.InfoWindow({
/* v this is what I want v */
content: new MyInfoWindowComponent(thing).toString()
/* ^ this is what I want ^ */
});
}