FileTransfer未定义 - AngularJS

Sam*_*Sam 6 angularjs cordova angularjs-directive ionic-framework ngcordova

我试图在angularjs(在Ionic中)实现文件上传,但是遇到了一些问题.我在项目目录中阅读了以下命令,然后在命令下运行 -

bower install ngCordova
cordova plugin add org.apache.cordova.file-transfer
Run Code Online (Sandbox Code Playgroud)

然后,我在index.html中添加了所需的引用 -

<!-- ngCordova script -->
<script type="text/javascript" src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script type="text/javascript" src="cordova.js"></script>
Run Code Online (Sandbox Code Playgroud)

然后,我将服务注入我的控制器 -

angular.module('myApp').controller('AppController', ['$scope', $cordovaFileTransfer', function ($scope, $cordovaFileTransfer) 
Run Code Online (Sandbox Code Playgroud)

但是,当我尝试使用它时 -

var fileTransfer = new FileTransfer();
fileTransfer.upload("server url", "file path", options).then(function(result)...
Run Code Online (Sandbox Code Playgroud)

我收到一个错误 -

Uncaught ReferenceError: FileTransfer is not defined AppController.js:35     
angular.module.controller.$scope.uploadFile AppController.js:22 (anonymous function)
n.event.dispatch jquery-2.1.3.min.js:3 
n.event.add.r.handle jquery-2.1.3.min.js:3 
Run Code Online (Sandbox Code Playgroud)

我是AngularJS的新手,不知道这里出了什么问题.我在这里错过了参考文献吗?任何人都可以帮我解决这个问题吗?

提前致谢.

EDIT1

以下是Ionic的初始化方法 -

.run(function ($ionicPlatform) {
    $ionicPlatform.ready(function () {
        // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
        // for form inputs)
        if (window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        }
        if (window.StatusBar) {
            // org.apache.cordova.statusbar required
            StatusBar.styleDefault();
        }
    });
})
Run Code Online (Sandbox Code Playgroud)

EDIT2

AppController.js代码在这里

Bla*_*ley 4

我只是为自己说话,但 FileTransfer 未定义可能有两个(离子:三个)原因。您不必自己定义这些对象(FileTransfer、File),它们在您安装两个插件后立即定义:

  1. 问题

    好方法:

    document.addEventListener("deviceready", onDeviceReady, false);
    
    function onDeviceReady() {
       // as soon as this function is called FileTransfer "should" be defined
       console.log(FileTransfer);
    }
    
    Run Code Online (Sandbox Code Playgroud)

    不好的做法:

    // calling FileTransfer before deviceready
    var f = new FileTransfer();
    ...
    document.addEventListener("deviceready", onDeviceReady, false);
    ...
    ...
    
    Run Code Online (Sandbox Code Playgroud)
  2. 问题

    文件插件也必须安装。调用 deviceready-function 后,“应该”定义文件对象:

    document.addEventListener("deviceready", onDeviceReady, false);
    
    function onDeviceReady() {
       // as soon as this function is called File "should" be defined
       console.log(File);
    }
    
    Run Code Online (Sandbox Code Playgroud)
  3. 问题(离子)

    当使用 ionic 时,需要以下命令将插件包含到创建的平台(android、ios、blackberry)中:

    ionic plugin add org.apache.cordova.file
    ionic plugin add org.apache.cordova.file-transfer
    
    Run Code Online (Sandbox Code Playgroud)

有时,Ionic 很难正确构建项目,在我的例子中,要么 deviceready 根本没有被触发,要么由于编译问题,构建平台一开始就失败了。