在 Angular JS 中检索 Iframe 内的数据绑定值

Posted 2023-03-05

【中文标题】在 Angular JS 中检索 Iframe 内的数据绑定值

【英文标题】：Retrieving the data binding value inside Iframe in Angular JS

【发布时间】：2015-02-08 04:39:41

【问题描述】：

我正在尝试在我的 Angular 模板中加载一个外部页面。但是，我需要将 sess_id 值与 url 一起传递以进行身份​​验证。我在我的 div 中添加了一个 iframe 并调用了 url 以及 sess_id 值。 sess_id 值在我的模态中正确检索。但我无法在 iframe 中加载页面。

我要检索的 url 结构应该类似于“urlhere?ss_id=bfc443c761de8b2ba18c82fecc50fd77”

  <section class="panel panel-default" data-ng-controller="loginController">
        <div class="panel-body" style=" position: relative;">
            <div id="report_loader" style="min-height:600px;">
            sess_id // i can retrive the value here
        <iframe ng-src=" 'urlhere?ss_id=' + sess_id "> </iframe>
            </div>
        </div>
  </section>

任何帮助都将受到高度评价。

【问题讨论】：

显示完整网址的示例

【参考方案1】：

使用指令

angular.module('testModule').directive('iframeDr', function ($compile) 
return 
    restrict: 'AE',
    //terminal:true,
    link: function(scope, element, attr)  
        var tryme = scope.sess_id
        var ele = $compile('<iframe ng-src="urlhere?ss_id='+tryme+'"> </iframe>')(scope);
        element.replaceWith(ele);
    

)

并将指令添加到您的 iframe

<iframe ng-src=" 'urlhere?ss_id=' + sess_id " iframe-dr></iframe>