Angularjs动态调整iframe高度

Posted 2023-05-09

【中文标题】Angularjs动态调整iframe高度

【英文标题】：Angularjs resize dynamically iframe height

【发布时间】：2018-03-23 03:01:30

【问题描述】：

就我而言，我使用了 iframe，我需要根据其内容自动计算其高度。

我的代码是这样的

<iframe id='iframe' width='100%' height='600px' src='http://test.com' />

如何通过控制器或指令设置 iframe 内容高度？

谁能帮帮我？ 谢谢

【参考方案1】：

在你的情况下，我认为你想要的是定义一个像 iframeSetDimentionsOnload 这样的指令并在那里设置高度。几分钟后我会给你举个例子。

您的 iframeSetDimensionsOnload 指令：

yourApp.directive('iframeSetDimensionsOnload', [function()

 return 

  restrict: 'A',

  link: function(scope, element, attrs)
    element.on('load', function()

        /* Set the dimensions here, 
           I think that you were trying to do something like this: */

           var iFrameHeight = 

           element[0].contentWindow.document.body.scrollHeight + 'px';
           var iFrameWidth = '100%';
           element.css('width', iFrameWidth);
           element.css('height', iFrameHeight);
      )
   
 
])

像这样使用它：

<iframe iframe-set-dimensions-onload src='http://test.com' />