iframe - iFrame 上的 Angular、onLoad 函数

Question

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

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

当 iframe 的内容加载完毕后，会触发 uploadDone(); 方法。

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

Answer 1

评论一年前的问题。对于超过 1 个 iframe 的情况，我需要绑定(bind)“onload”事件。我采用了这种方法。

指令

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

Controller

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

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

DOM

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