أنجولار - كيف يمكنني عرض مكون Angular2 كسلسلة؟


أود أن أتمكن من استخدام بناء جملة قالب Angular2 عند بناء نافذة معلومات Google Maps.

حسب ما أستطيع أن أقول، هذا يعني تمرير مكون كسلسلة قالب إلى خاصية content في كائن منشئ InfoWindow.

إذا كان هذا هو الحال، أعتقد أنني بحاجة إلى تحويل قالب المكون إلى سلسلة نصية. هل هذا صحيح (وممكن)؟

إليك مثال على ما أعتقد أنني أحتاج إلى القيام به:

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

الإجابة رقم 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
    }
}