Angular2コンポーネントを文字列にレンダリングするにはどうすればよいですか？

Question

Google Maps InfoWindowをビルドするときに、Angular2テンプレート構文を使用したいと考えています。

私が知る限り、これは、テンプレート文字列としてコンポーネントをInfoWindowコンストラクタオブジェクトのcontentプロパティに渡すことを意味します。

これが当てはまる場合は、コンポーネントテンプレートを文字列化する必要があると思います。これは正しいのですか？ここで

は私が行う必要がある思い ものの例である：

// 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^*/ 
    }); 
} 

Answer 1

ElementRef angular.io/docs/ts/latest/api/core/ElementRef-class.htmlを渡して試してみてください。

ViewChildと

か何か：

https://angular.io/docs/ts/latest/api/core/ViewChild-var.html

私はあなたのためのコードを書くことはありませんが、アイデアはこのようなものです：

@Component({ 
    selector: 'my-infowindow', 
    template: `<p #kiddo>This is an infowindow for {{ something.name }}</p>` 
}) 
export class MyInfoWindowComponent { 
    @ViewChild('kiddo') viewChild; 
    constructor(public something: Thing) {} 
    ngOnInit(){ 
     yourFunction(this.viewChild); //or viewChild.innerHtml or w/e works 
    } 
}