0

我刚刚将我正在处理的应用程序从 angular 11 更新到 12。(也将 typscript 从 4.0.5 更新到 4.3.5)。我们注意到应用程序中的一个不同之处,在我有一个空值之前,我现在在我的应用程序中得到了文本“null”。

在此处输入图像描述

我已经缩小了问题发生的范围,归结为:(我为演示目的硬编码了空值)

<div>
  <span [innerHTML]="null | sanitizeHtml"></span>
</div>

管道代码:

@Pipe({
  name: 'sanitizeHtml'
})
export class SanitizeHtmlPipe implements PipeTransform {

  constructor(private _sanitizer:DomSanitizer) {
  }

  transform(v:string):SafeHtml {
    return this._sanitizer.bypassSecurityTrustHtml(v);
  }
}

所以返回的safeHtml对象bypassSecurityTrustHtml好像变了,或者处理空值的方法变了。谁能解释这种行为?

编辑

用于重现问题的堆栈闪电战: https ://stackblitz.com/edit/angular-v12-ejwhmd?file=package.json

编辑 2

为 Angular https://github.com/angular/angular/issues/43794创建了一个错误

4

1 回答 1

1

这个问题在我的错误问题(https://github.com/angular/angular/issues/43794)中得到了回答。

摘要:很可能是由于类型安全改进,null 不再出现在bypassSecurityTrustHtml. 因此 null 的处理方式与以前有所不同。现在它将像文本一样呈现,而不是实际的 null。

解决方法是在将可能的 null 值传递给bypassSecurityTrustHtml. https://stackblitz.com/edit/angular-v12-zn77kb?file=src%2Fapp%2Fapp.component.html

于 2021-10-11T09:58:25.960 回答