Angular：阻止DomSanizer更新DOM事件

Question

我遇到DomSanitizer的问题。

我创建了一个StackBlitz来复制此问题。

每次单击按钮时，都会重新加载iframeA。该按钮完全不执行任何操作-因此它与iframe无关。

iframe A对其源具有动态引用。为此，我使用DomSanitizer。

iframe B具有静态参考，并且此处未重新加载-我期望什么。 只是为了表明它与消毒剂有关。

因此，我需要在应用程序中添加一个iframe，其内容应取决于应用程序的状态（某些输入）。如果那改变了，那么重新加载就可以了。

但是，我无法接受每次与iframe没有连接的按钮的重新加载。

我该如何处理？感谢您的支持！

Answer 1

问题：

此问题是由于您在数据绑定语法中使用了method引起的，

<iframe 
  [src]="getURL()" 
  width="100%" 
  height="100px">
</iframe>

因此，每当Angular执行变更检测时，getURL将被调用。

解决方案：

您可以创建一个Pipe来清理iframe src网址。我在this answer中做了类似的事情。

这样，您的iframe不会在每次Angular执行变更检测时重新加载。

  

这是您推荐的Working Sample StackBlitz。