带字符串变量的Angular 2 NgTemplateOutlet。

我希望在.ts文件中有一个模板字符串，并将其添加到NgTemplateOutlet

我希望这能奏效，但没有成功

<template [ngTemplateOutlet]="template" [ngOutletContext]="$implicit">

其中template是作用域中的字符串变量。所以我实现了这个，但是它也不能像我希望的那样工作

import { Component, AfterViewInit } from '@angular/core';
import { ToastController } from 'ionic-angular';
import { ModalController } from 'ionic-angular';
import { DomSanitizer, SafeHtml} from '@angular/platform-browser';

@Component({
 selector: 'dynamic-report',
 templateUrl: 'dynamicReport.html',
})
export class DynamicReport implements AfterViewInit{
 private _template: string;
 context: any;

 public get template() : SafeHtml {
   return this.sanitizer.bypassSecurityTrustHtml(this._template);
 }

 constructor(public toastCtrl: ToastController, public modalCtrl:ModalController, private sanitizer: DomSanitizer) {
   this._template = "<button (click)='testFunction1('2')'>Click here 2!</button>";
   this.context = this;

 }

  testFunction1(message){
    console.log(message);
  }

  ngAfterViewInit() {

  }

}

从'@angular/core'导入{Component，AfterViewInit}；
从“离子角度”导入{ToastController}；
从“离子角度”导入{ModalController}；
从“@angular/platform browser”导入{domsanizer，SafeHtml}；
@组成部分({
选择器：“动态报告”，
templateUrl:'dynamicReport.html'，
})
导出类DynamicReport实现AfterViewInit{
私有模板：字符串；
背景：任何；
public get template（）：SafeHtml{
返回此.sanitizer.bypassSecurityTrustHtml（此.\u模板）；
}
构造函数（public-toastCtrl:ToastController、public-modalCtrl:ModalController、private-sanitizer:domsanizer）{
这是。_template=“单击此处2！”；
this.context=this；
}
testFunction1（消息）{
控制台日志（消息）；
}
ngAfterViewInit（）{
}
}

HTML:

点击这里1！

其结果是： 我看到视图中的按钮。 发送消息1的第一个按钮将1打印到控制台。但是，另一个按钮不会打印任何消息

---

我希望保留.ts文件中的templatestring，那么如何实现这一点，以便模板能够掌握这些函数

更新角度5

ngOutletContext

被重命名为

ngTemplateOutletContext

另见

原创

如果要使用包含特定于Angular2的语法（如绑定）的字符串，则需要在运行时创建一个组件，将该字符串用作组件模板。另见

$implicit

可以像

<template [ngTemplateOutlet]="template" [ngOutletContext]="{$implicit: 'somecontextValue'}">

---

你能提供plunker吗？什么是

$implicit

？@GünterZöchbauer来自：注意：在上下文对象中使用键$implicit将其值设置为默认值。但是，在提供的代码中，它似乎没有以任何有效的方式使用。它应该是

我明白了：D没有问题。只需更新正确的问题。您可以删除与此q+a无关的评论。我认为可能缺少一个报价，或者意外添加了一个报价。

<template [ngTemplateOutlet]="template" [ngOutletContext]="{$implicit: 'somecontextValue'}">

<template #report let-context>
  <div>{{context}}</div> <!-- outputs `somecontextValue` -->
</template>