Angular：防止 DomSanizer 在 DOM 事件上更新
Angular: Prevent DomSanizer from updating on DOM Events
我遇到了 DomSanitizer 的问题。
我创建了一个 StackBlitz 来复制这个问题。
每次单击按钮时，都会重新加载 iframe A。该按钮绝对不执行任何操作 - 因此它与 iframe 无关。
iframe A 具有对其源的动态引用。为了完成这项工作，我使用 DomSanitizer.
iframe B 有一个静态引用，这里没有重新加载 - 这是我所期望的。
只是为了表明它与消毒剂有关。
所以我需要在我的应用程序中有一个 iframe，它的内容应该取决于应用程序的状态（一些输入）。如果这种情况发生变化，那么重新加载就可以了。
但我无法接受每次单击与 iframe 无关的按钮时的重新加载。
我该如何处理？感谢支持！
问题：
问题是因为你在data-binding语法中使用了method，这里：
<iframe
[src]="getURL()"
width="100%"
height="100px">
</iframe>
因此，每次 Angular 执行变更检测时，都会调用 getURL。
解决方法：
您可以创建一个 Pipe 来清理 iframe src url。我在 .
中做过类似的事情
这样，您的 iframe 就不会在每次 Angular 执行更改检测时都重新加载。
Here's a Working Sample StackBlitz for your ref.
我遇到了 DomSanitizer 的问题。
我创建了一个 StackBlitz 来复制这个问题。
每次单击按钮时，都会重新加载 iframe A。该按钮绝对不执行任何操作 - 因此它与 iframe 无关。
iframe A 具有对其源的动态引用。为了完成这项工作，我使用 DomSanitizer.
iframe B 有一个静态引用，这里没有重新加载 - 这是我所期望的。 只是为了表明它与消毒剂有关。
所以我需要在我的应用程序中有一个 iframe，它的内容应该取决于应用程序的状态（一些输入）。如果这种情况发生变化，那么重新加载就可以了。
但我无法接受每次单击与 iframe 无关的按钮时的重新加载。
我该如何处理？感谢支持！
问题：
问题是因为你在data-binding语法中使用了method，这里：
<iframe
[src]="getURL()"
width="100%"
height="100px">
</iframe>
因此，每次 Angular 执行变更检测时，都会调用 getURL。
解决方法：
您可以创建一个 Pipe 来清理 iframe src url。我在
这样，您的 iframe 就不会在每次 Angular 执行更改检测时都重新加载。
Here's a Working Sample StackBlitz for your ref.