Javascript AngularJs清理和显示html

Javascript AngularJs清理和显示html,javascript,html,angularjs,ngsanitize,Javascript,Html,Angularjs,Ngsanitize,我试图在div中动态显示html。但是divng bind html根本不显示(在firefox、chrome和safari上) 看看这个网站的其他帖子,我发现我必须加入ngSanitize 我在这里找到了这个片段: angular.module('myApp',['ngSanitize']) 然而,我不知道我应该在哪里写这段代码。。。你知道我怎么做吗 多谢各位 这是我的密码: component.ts中的代码: import { Component, OnInit, SecurityConte

我试图在div中动态显示html。但是div
ng bind html
根本不显示(在firefox、chrome和safari上)

看看这个网站的其他帖子,我发现我必须加入ngSanitize

我在这里找到了这个片段:

angular.module('myApp',['ngSanitize'])

然而,我不知道我应该在哪里写这段代码。。。你知道我怎么做吗

多谢各位

这是我的密码:

component.ts中的代码:

import { Component, OnInit, SecurityContext } from '@angular/core';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';

@Component({
  selector: 'app-player-filter',
  templateUrl: './player-filter.component.html',
  styleUrls: ['./player-filter.component.css']
})
export class PlayerFilterComponent implements OnInit {

  text = '<h1>Test</h1><script></script>';
  text_sanitized: SafeHtml;
  constructor(private _sanitizer: DomSanitizer) { }

  ngOnInit() {
      this.text_sanitized = this.htmlProperty;
  }

  public get htmlProperty(): SafeHtml {
      return this._sanitizer.sanitize(SecurityContext.HTML, this.text);
  }

}
从'@angular/core'导入{Component,OnInit,SecurityContext};
从“@angular/platform browser”导入{domsanizer,SafeHtml};
@组成部分({
选择器:“应用程序播放器筛选器”,
templateUrl:'./player filter.component.html',
样式URL:['./player filter.component.css']
})
导出类PlayerFilterComponent实现OnInit{
text=‘Test’;
净化文本:安全HTML;
构造函数(私有_sanitizer:DomSanitizer){}
恩戈尼尼特(){
this.text_sanitized=this.htmlProperty;
}
public get htmlProperty():SafeHtml{
返回此._sanitizer.sanitize(SecurityContext.HTML,this.text);
}
}
component.html中的代码:

<div ng-bind-html="text_sanitized"></div>
Normal: {{text}} Sanitized: {{text_sanitized}}

正常:{text}}净化:{{text_净化}
firefox上的输出:

正常:测试消毒:测试

输出控制台:

警告:清除某些内容(请参阅http://g.co/ng/security#xss).

控制台输出显示已执行清理操作(由清除脚本的已清理输出确认)。
Wierd thing,控制台中显示不安全的html没有错误…

'ng-bind-html'
属于angularJS(Angular2+之前的旧版本),因此Angular6不工作或显示任何内容

使用
[innerHTML]
代替,如中所述:


'ng-bind-html'
属于angularJS(Angular2+之前的旧版本),因此它不应该使用Angular6工作或显示任何内容

使用
[innerHTML]
代替,如中所述:



在你的标题中,你说的是Angular6,你的代码是angularJs/angular1。。。我建议先学习angularJs的基础。。。大多数情况下,应用程序模块是在名为
app.js
的文件中声明的,但这取决于您的项目结构和文件命名…在标题中,您的代码是angularJs/angular1。。。我建议先学习angularJs的基础。。。应用程序模块通常在名为
app.js
的文件中声明,但这取决于您的项目结构和文件命名……很乐意帮忙!:)很乐意帮忙!:)
<div [innerHTML]="text_sanitized"></div>