将角度动态组件附加到tippy js内容

Question

我正在使用带有tippy js的angular中的fullcalendar(v3)事件渲染，那么如何在fullcalendar(v3)事件渲染中将angular动态组件附加到tippy js内容中呢？

    const eventRender = function (event: IEvent, view) {
        if (event.info) {
            const factory = this._resolver.resolveComponentFactory(EventViewComponent);
            let ref;
            if (event.rendering === 'background') {
                ref = factory.create(this._injector, [], view.get(0));
            } else {
                ref = factory.create(this._injector, [], view.children('.fc-content').get(0));
            }
            ref.instance.eventInfo = event.info;
            this.dynamicComponent.push(ref);
            this._app.attachView(ref.hostView);
        }

此外，我还创建了动态组件，并附加到事件渲染到完整日历

Answer 1

html：

<div #tippyTemplate>
    <h4>Caption</h4>
    <p>Some content</p>
</div>

ts：

@ViewChild("tippyTemplate", { read: ElementRef, static: false }) tippyTemplate: ElementRef;
...
const template = this.tippyTemplate.nativeElement;

tippy(info.el, {
   content: template,
   allowHTML: true,
   hideOnClick: "toggle",
   placement: "top",
   trigger: "click",
});