如何设置在我的案件的iframe的内容高度？ [英] How to set the iframe content height in my case?

问题描述

我通过角度想安装的iframe内容高度

I am trying to setup the iframe content height through angular

我有这样的事情

<iframe id='iframe' width='100%' height='600px' data-ng-init="init('iframe')" 
 src='http://test.com' />

在我的控制器

 $scope.init = function(id) {
            console.log($('#'+ id))  -> show my iframe
            var x= $('#'+ id)..contentWindow.document.body.scrollHeight;
            console.log(x) -> gives me undefined

            var y = $('#'+ id)..contentWindow;
            console.log(y) -> give me undefined too 
        }

我将通过我的控制器中的iframe中的内容高度怎么办？

How do I set the iframe content height through my controller?

谢谢！

推荐答案

从code一些意见：

1. NG-INIT 不是 $（窗口）。在（加载功能（）{的equivalient .. }），约 NG-init的详细信息此处的 https://docs.angularjs.org/api/ng/directive/ngInit 。这就是为什么你得到未定义为 X 和是，因为被执行code当iframe中还没有被加载。

1. ng-init is not the equivalient of $(window).on("load", function(){...}), more information about ng-init here: https://docs.angularjs.org/api/ng/directive/ngInit . That's why you are getting undefined for x and y, because when that code is executed the iframe hasn't been loaded yet.

在角度不是从控制器访问DOM是个好主意，可考虑做这些的排序操作的指令来代替。

In angular is not a good idea to access the DOM from the controller, consider doing those sort of operations in a directive instead.

如果您从开始angularjs我会建议你尽量不要使用jQuery。

If you are starting with angularjs I would recommend you to try not to use jQuery.

在你的情况我认为，你想要的是这样定义 iframeSetDimentionsOnload 指令，并设置高度那里。我会给你比如在几分钟的时间。

In your case I think that what you want is to define a directive like iframeSetDimentionsOnload and set the height there. I will give you in example in a few minutes.

您 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' />

这篇关于如何设置在我的案件的iframe的内容高度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！