Angularjs动态调整iframe高度

时间:2017-10-11 12:24:55

标签: jquery angularjs iframe angularjs-directive

在我的情况下,我使用了iframe,我需要根据其内容自动计算其高度。

我的代码看起来像这样

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

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

任何人都可以帮助我吗? 感谢

1 个答案:

答案 0 :(得分: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' />