需要在角度2中插入Script标签

我已经做了一些阅读和搜索，几乎所有我发现的内容都表明脚本标签不能包含在 Angular 2 的模板中。

我们会像您一样有意从模板中删除标签 不应该使用它们来按需加载代码。https://github.com/angular/angular/issues/4903 [2015]

However- 有一个功能bypassSecurityTrustScript

我想知道何时以及如何bypassSecurityTrustScriptAngular 2 中的意图是使用什么？

我知道有人问过类似的问题：Angular2动态插入脚本标签- 虽然没有人回答他们如何使用的问题bypassSecurityTrustScript，而且我不确定为该问题提供的答案如何工作，因为它似乎在模板中使用 JavaScript。

在您的视图中包含脚本通常是一种不好的做法。如果你坚持这样做，你可以使用这个组件：

scripthack.component.html：

<div #script style.display="none">
  <ng-content></ng-content>
</div>

scripthack.component.ts：

import { Component, ElementRef, ViewChild, Input } from '@angular/core';

@Component({
    selector: 'script-hack',
    templateUrl: './scripthack.component.html'
})
export class ScriptHackComponent {

    @Input()
    src: string;

    @Input()
    type: string;

    @ViewChild('script') script: ElementRef;

    convertToScript() {
        var element = this.script.nativeElement;
        var script = document.createElement("script");
        script.type = this.type ? this.type : "text/javascript";
        if (this.src) {
            script.src = this.src;
        }
        if (element.innerHTML) {
            script.innerHTML = element.innerHTML;
        }
        var parent = element.parentElement;
        parent.parentElement.replaceChild(script, parent);
    }

    ngAfterViewInit() {
        this.convertToScript();
    }
}

用法（内联）：

<script-hack>alert('hoi');</script-hack>

用法（外部）：

<script-hack src="//platform.twitter.com/widgets.js" type="text/javascript"></script-hack>