iframe

Question

我在Angular中有一个所需的IFrame，可以像这样工作

<iframe ng-src="{{detailFrame}}" align="middle" width="1000" height="200" frameborder="0"></iframe>

但是，在另一个页面上，我需要在循环中将值附加到具有模板类型值的另一个页面

 {{tip.id}} 

所以我想在另一个页面上这样做

<iframe ng-src="{{detailFrame}}?id={{tip.id}}" align="middle" width="1000" height="200" frameborder="0"></iframe>

我已经知道并使用$ sce injection

.controller('TipsCtrl',

function ($http, $scope, UserService, $location, $routeParams, Categories, Tip, error, $sce) {

因此我的细节框架如下所示：

$scope.detailFrame = $sce.trustAsResourceUrl("http://localhost:17308/Home/GetNewsComments");

我想做的就是在{{tip.id}}变化的末尾添加一个值，但例如只是一个像10345的数字

错误：Chrome F12，看起来模板无法渲染

<iframe ng-src="{{detailFrame}}?id={{tip.id}}" align="middle" width="1000" height="200" frameborder="0"

我也在页面上看到：

Cannot GET /doc-home/%7B%7BdetailFrame%7D%7D?id={{tip.id}}

Answer 1

我怀疑你没有得到反馈有两个原因。

1. IFrame通常不是标准的，更多的是边缘案例/禁忌
2. 基于＃1，更多参与Angular的人没有经验做你需要的“黑客”。

  

然而，这是你想要做的。

HTML：

{{setTipId(tip.id)}}      (this calls a function in your loop passing in each unique tip.id 

控制器：

 $scope.setTipId = function (id) {
   $scope.detailFrame = $sce.trustAsResourceUrl("http://localhost:17308/Home/GetNewsComments?id=" + id);
}

  

您必须将此代码保留在函数中才能获得唯一ID

强烈建议使用指令，但我想从您的代码中可以“完成工作。”