SafeValue 必须使用 [属性]=binding 尽管我已经在使用 属性 绑定
SafeValue must use [property]=binding although I'm already using property binding
我有以下 HTML 和 属性 绑定:
<div [innerHtml]="logOutput"></div>
在我的组件中,我现在用这行代码添加了一些内容
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutput + otpStr );
但是我还是收到这个错误 "SafeValue must use [property]=binding"。
为什么我会收到这个错误?我已经在使用 属性 绑定了!我正在使用 Angular 5.
编辑:我尝试在 HTML 中使用自定义管道,效果很好,但我想要一个没有管道的解决方案。
编辑2:
这是我的函数,我在其中设置了 HTML,也许它有帮助。一个完整的工作示例是不可能的,因为我的应用程序处理命令行工具和输出流(我在 Electron 框架中有 Angular)
this.logStream.on('data', (chunk) => {
let otpStr = chunk.toString();
if (otpStr == '') {
return;
}
otpStr = this.StylePipe(otpStr); // Convert ANSI Styles to HTML with CSS
otpStr = otpStr.replace(/\r?\n/g, '<br />');
otpStr = otpStr.replace(/<br \/><br \/>/g, '<br />');
otpStr = otpStr.replace(/^<br \/>/, '');
otpStr = otpStr.replace(/<br \/>$/, '');
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutput + otpStr + '<br />' );
this.ref.detectChanges();
});
this.logStream.on('end', () => {
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutput + '<br />' );
this.ref.detectChanges();
});
我现在在评论中@JB Nizet 的帮助下解决了这个问题。我现在使用两个变量。第一个是包含我生成的原始 HTML 的辅助变量,另一个变量包含绑定到 HTML 的经过清理的 HTML,因为您无法连接 SafeHtml(绕过的结果)和一个字符串。
this.logOutputHtml += otpStr;
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutputHtml );
我有以下 HTML 和 属性 绑定:
<div [innerHtml]="logOutput"></div>
在我的组件中,我现在用这行代码添加了一些内容
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutput + otpStr );
但是我还是收到这个错误 "SafeValue must use [property]=binding"。
为什么我会收到这个错误?我已经在使用 属性 绑定了!我正在使用 Angular 5.
编辑:我尝试在 HTML 中使用自定义管道,效果很好,但我想要一个没有管道的解决方案。
编辑2:
这是我的函数,我在其中设置了 HTML,也许它有帮助。一个完整的工作示例是不可能的,因为我的应用程序处理命令行工具和输出流(我在 Electron 框架中有 Angular)
this.logStream.on('data', (chunk) => {
let otpStr = chunk.toString();
if (otpStr == '') {
return;
}
otpStr = this.StylePipe(otpStr); // Convert ANSI Styles to HTML with CSS
otpStr = otpStr.replace(/\r?\n/g, '<br />');
otpStr = otpStr.replace(/<br \/><br \/>/g, '<br />');
otpStr = otpStr.replace(/^<br \/>/, '');
otpStr = otpStr.replace(/<br \/>$/, '');
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutput + otpStr + '<br />' );
this.ref.detectChanges();
});
this.logStream.on('end', () => {
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutput + '<br />' );
this.ref.detectChanges();
});
我现在在评论中@JB Nizet 的帮助下解决了这个问题。我现在使用两个变量。第一个是包含我生成的原始 HTML 的辅助变量,另一个变量包含绑定到 HTML 的经过清理的 HTML,因为您无法连接 SafeHtml(绕过的结果)和一个字符串。
this.logOutputHtml += otpStr;
this.logOutput = this.sanitizer.bypassSecurityTrustHtml( this.logOutputHtml );