Angular 7与iframe链接

Question

我正在尝试将链接（project.projectUrl）绑定到iframe中，但似乎无法使其正常工作。我正在尝试将JSON文件中的projectUrl绑定到iframe src，以便在可能的情况下从模式内部动态显示iframe。请在下面的评论中查看我的代码。

Answer 1

您需要清理 src。 https://angular.io/api/platform-browser/DomSanitizer#bypassSecurityTrustResourceUrl。

在组件构造函数中执行此操作的方法之一：

constructor(sanitizer: DomSanitizer, ....)

然后

<iframe [src]="sanitizer.bypassSecurityTrustResourceUrl(project.projectUrl)" height="600" width="1000"></iframe>

Answer 2

我通过javascript解决了我的问题。

在这种情况下，您不应使用 Select customerId,sum(amount) From TableName Where storename = "Beck's cakes" and OrderType = "in-person" Group By customerId 或[]。

通过viewChild或其他方法将元素放入模板，然后将属性设置为模板。

这是代码示例。

HTML模板

{{}}

以您的组件

<iframe #iframe height="600" width="1000"></iframe>

Answer 3

您认为我使用的是Angle到HTML注入器错误

<iframe [src]="project.projectUrl" height="600" width="1000"></iframe>

或

<iframe src="{{project.projectUrl}}" height="600" width="1000"></iframe>

如果两者都做，基本上就是在打字稿中称呼它 {{project.projectUrl}}而不只是project.projectUrl 我建议您使用[src]，因为这就是文档中建议的内容，而且更易于阅读。

希望这会有所帮助：）