Javascript\角度函数帮助-心智块

我不知道JS是什么，但我有一个心理障碍。我为这个愚蠢的问题道歉，但我不知所措，因为无论我读了多少书，我都无法将学术成果付诸实践。特别是当涉及到嵌套函数时

我有一个控制器，比如FileCtrl。在它里面，我有以下内容，用于侦听通过指令添加到输入字段的文件。我正试图为HTML5 fileReader注入一个名为fileReader的Angular JS工厂服务和一个队列服务

但是，我在fileReader上不断遇到一个未定义的错误。我知道为什么，因为它看不到fileReader，但在$scope上注入它。$on，然后再在$scope上注入。$apply不起作用。另外，在$scope.$on末尾添加fileReader作为闭包也不起作用

我应该补充一点，我可以看到args.file，如果我删除fileReader代码，它将推送文件，没有问题，但我没有缩略图。所以我认为它是有效的，只是不适用于fileReader，这是因为我对注入做了一些错误的事情

旁注，对于下面的VAL注释，我使用apply，因为我发现在没有它的情况下存在图像渲染同步问题，这对于较小的图像很好，但对于较大的图像，它会冻结，这就是我尝试创建和使用$q fileReader服务的原因。我想另一种解决方法是在数组条目上创建一个watch/指令，当img返回64编码字符串时，填充html元素。。。就像我说的JS精神障碍：

myApp.controller('FileController', ['$scope', 'FileReaderService',  function($scope, FileReaderService  ){  
    $scope.$on("fileSelected", function (event, args) {
        $scope.$apply(function () {
            $scope.progress = 0;
            fileReader.readAsDataUrl(args.file, $scope)
            .then(function(result) {
                $scope.imageSrc = result;
            });
            $scope.files.push(args.file);
        });
    });
});

---

在AngularJS中，并非所有函数都是通过依赖注入处理的。在控制器中，指令定义中的指令和控制器中的指令（不在链接或编译上）服务AngularJS注入请求的实例，但在一些其他函数（如事件侦听器）中，参数按位置传递

在您的情况下，您需要将fileReader放入控制器上的定义中，而不是事件侦听器上的定义中

---

您还需要删除apply，因为通过$on添加的事件侦听器包含在摘要循环中。

感谢所有人的回复。Val你让我回去做了更多的研究，我通过调试找到了答案。我还不知道为什么，但我有个主意

如果您的factory服务中有错误，在我的例子中，FileReaderService不会在引导服务时总是爆炸，只会在调用服务时爆炸，这是有意义的。如果服务出现问题，整个服务将无法启动。此外，将其注入控制器时，您不会收到任何错误消息。我不得不在模块上放置一块手表，并注意到有一个参考错误。我发现我缺少一个函数

我这方面完全没有经验，但我一直试图从$q服务中捕获结果，这做得很好，但随后尝试在$q返回之外注入，即，我试图捕获$scope.imageSrc=result并将其插入post。然后，由于存在同步问题，这不起作用。我可以在$scope.files中看到该值，但它不会显示在console.log或HTML中。所以我把所有的文件操作都放到了。然后，它就完美地工作了。当你考虑它时，逻辑是：如果你不打算使用它，为什么要有$q。。。哈哈

//问题代码

fileReader.readAsDataUrl(args.file, $scope)
.then(function(result) {
    $scope.imageSrc = result;
});
// cannot and should not try to work the results outside the return promise 
$scope.files.imgSource = $scope.imageSrc;
$scope.files.push(args.file);

//固定和工作代码

myApp.controller('FileController', ['$scope', 'FileReaderService',  function($scope, FileReaderService  ){ 
    var reader;
    $scope.files = [];

    //listen for the file selected event
    $scope.$on("fileSelected", function (event, args) {
        $scope.progress = 0;
        var file = args.file;
        FileReaderService.readAsDataUrl(file, $scope)
            .then(function(result) {
                file.imgSource = result;
                $scope.files.push(file);
            });
    });
});

---

你能从你的文件阅读器上分享一点吗，可能只是一个声明。你的页面上也包含了fileReader脚本吗？是的，Nolan，你所有的模块代码都是want=Val，我的控制器中有它，只是为了简洁起见没有添加所有的代码。myApp.controller'FileController'，['$scope'，'fileReader'，函数$scope，fileReader{在更新的代码示例中，我没有看到$on，所以我看不到fileReader上哪里有未定义的错误。我假设您将其传递给了$on listener，所以在调用listener时，它会被未定义的覆盖。Val，sry我已经将其返回。我的问题是如何将fileReader注入函数。我已经尝试将其作为参数和closure.Ne这是另一个工作。这实际上更多的是JS问题，所以我的问题可能会让这个问题变得更复杂。如果父作用域上有可用的东西，我说的是JS可见性作用域，而不是AngularJS，所以它在内部作用域中可用。“Close”版本应该工作得很好。您不需要将引用传递给fileReader到inner侦听器函数，如果它在控制器的函数中可用。您可以尝试将其放入plnkr.co，以便我们可以查看并修复您的代码。