iFrame上的Angular,onLoad函数

Question

我有这个iframe使用基本的JavaScript:

<iframe id="upload_iframe" name="upload_iframe" onLoad="uploadDone();"></iframe>

uploadDone();在加载iframe的内容时触发该方法.

我如何在Angular中做同样的事情？我想在iframe加载时调用控制器上的函数,但ng-onload到目前为止我还没有看到过.

Answer 1

评论一年的问题.对于有超过1个iframe的情况,我需要将"onload"事件绑定到.我做了这个方法.

指示

APP.directive('iframeOnload', [function(){
return {
    scope: {
        callBack: '&iframeOnload'
    },
    link: function(scope, element, attrs){
        element.on('load', function(){
            return scope.callBack();
        })
    }
}}])

调节器

APP.controller('MyController', ['$scope', function($scope){

    $scope.iframeLoadedCallBack = function(){
        // do stuff
    }
}]);

DOM

<div ng-controller="MyController">
    <iframe iframe-onload="iframeLoadedCallBack()" src="..."></iframe>
</div>

Answer 2

尝试在控制器中定义函数:

window.uploadDone=function(){
  /* have access to $scope here*/
}

Answer 3

对于任何使用 Angular 2+ 的人来说，这很简单：

<iframe (load)="uploadDone()"></iframe>

没有全局功能，适用于多个 iframe。