我正在尝试在angularjs(在Ionic中)中实现文件上传,但遇到了一些问题。我阅读了一个文档,随后我在项目目录中运行了以下命令 -
bower install ngCordova
cordova plugin add org.apache.cordova.file-transfer
然后,我在索引中添加了所需的引用.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>
然后,我将服务注入我的控制器 -
angular.module('myApp').controller('AppController', ['$scope', $cordovaFileTransfer', function ($scope, $cordovaFileTransfer)
但是,当我尝试像这样使用它时——
var fileTransfer = new FileTransfer();
fileTransfer.upload("server url", "file path", options).then(function(result)...
我收到一个错误 -
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
我是 AngularJS 的新手,不确定这里出了什么问题。我在这里缺少参考资料还是其他东西?谁能帮我解决这个问题?
提前谢谢。
编辑1
以下是 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();
}
});
})
编辑2
应用控制器.js代码在这里
我只是为自己说话,但可能有两个(离子:三个)文件传输未定义的原因。而且您不必自己定义这些对象(FileTransfer,File),它们在安装两个插件后立即定义:
-
问题
好方法:
document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { // as soon as this function is called FileTransfer "should" be defined console.log(FileTransfer); }
不好的方法:
// calling FileTransfer before deviceready var f = new FileTransfer(); ... document.addEventListener("deviceready", onDeviceReady, false); ... ...
-
问题
还必须安装文件插件。在设备就绪函数被称为文件对象之后,"应该"定义:
document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { // as soon as this function is called File "should" be defined console.log(File); }
-
问题(离子)
当使用离子时,需要以下命令将插件包含在创建的平台(android,ios,黑莓)中:
ionic plugin add org.apache.cordova.file ionic plugin add org.apache.cordova.file-transfer
有时 Ionic 很难正确构建您的项目,在我看来,要么根本没有触发 deviceready,要么由于编译问题而首先构建平台失败。
IONIC 项目中使用此插件时,我也陷入了这个问题。
建议:检查 Android 清单文件中的文件读取和写入权限。
在清单中添加权限可以解决您的问题。