10

我为我的应用程序创建了一个指令,在以下问题中提到了 如何使用 AngularJS 或 Javascript 提供文件以供下载?指令代码如下

    appModule.directive('fileDownload', function ($compile) {
        var fd = {
            restrict: 'A',
            link: function (scope, iElement, iAttrs) {

                scope.$on("downloadFile", function (e, url) {
                    var iFrame = iElement.find("iframe");
                    if (!(iFrame && iFrame.length > 0)) {
                        iFrame = $("<iframe style='position:fixed;display:none;top:-1px;left:-1px;'/>");
                        iElement.append(iFrame);
                    }
                    iFrame.attr("src", url);
                });
            }
        };
        return fd;
    });

这里使用了 scope.$on,当我通过 $scope.$emit 或 $scope.$broadcast 调用此事件时,它不起作用。我的控制器代码如下

    function reportsController($scope, $http) {
        var self = this;

        $scope.$broadcast("downloadFile", 'http://google.com');
        $scope.$emit("downloadFile", 'http://google.com');
    }

我的html文件如下

    <div ng-controller="reportsController" id="repctrl">
        <a file-download></a>
    </div>

我在这里做错了什么?

@Edit:在编译阶段添加了订阅($on)以避免在控制器中使用$timeout。在这里您可以查看示例

4

2 回答 2

7

我认为你的控制器在你的指令之前被初始化..所以在$on之后开始监听$emit$broadcast已经发生了。

看到这个笨蛋

打开控制台,您可以看到 console.logs 何时发生:

controller init happened script.js:16
link happened script.js:7
$scope.test() happened script.js:21
scope.$on happened script.js:9
scope.$on happened 

如果您在ng-view创建指令后使用初始化控制器或执行发射/广播,它应该可以工作。

于 2013-12-17T07:52:21.460 回答
1

当我尝试在模态指令中调用函数时,类似的事情发生在我身上,

我必须做的是在我拨打电话以显示模式后进行延迟:

        $timeout(function () {
            $rootScope.$broadcast('obtiene-plantillas');
        }, 500);
于 2017-06-07T14:40:46.087 回答