如何从设备中选择多张图片？

Question

如果我创建一个简单项目：

ionic start MyApp

并添加 ImagePicker 插件：

ionic plugin add https://github.com/wymsee/cordova-imagePicker.git -save

只需将此示例www文件夹复制到项目中，并执行以下操作：

ionic platform add android
ionic build android
ionic run android

一切正常。我可以按照预期选择多个图像而不出现任何错误。

到目前为止，一切都很好。现在我尝试将其包含到我的项目中，因此我添加了ImagePicker插件。现在这是我的插件列表：

ionic plugin ls
com.synconset.imagepicker 1.0.6 "ImagePicker"
cordova-plugin-camera 1.1.0 "Camera"
cordova-plugin-device 1.0.0 "Device"
cordova-plugin-dialogs 1.1.0 "Notification"
cordova-plugin-splashscreen 2.0.0 "Splashscreen"
cordova-plugin-statusbar 1.0.0 "StatusBar"
cordova-plugin-vibration 1.1.0 "Vibration"
cordova-plugin-whitelist 1.0.0 "Whitelist"

我创建了一个新模块：

angular.module('App.ImageSelect', [])

.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider.state('app.imageSelect', {
        url: "/products/prints/pola/imageSelect",
        views: {
            'menuContent': {
                templateUrl: "modules/products/prints/pola/imageSelect/imageSelect.html",
                controller: 'ImageSelectController'
            }
        }
    });
})

.controller('ImageSelectController', function ($scope, $cordovaImagePicker) {
    $scope.images = [];

    $scope.selectImages = function () {
        $cordovaImagePicker.getPictures(
            function (results) {
                for (var i = 0; i < results.length; i++) {
                    console.log('Image URI: ' + results[i]);

                    $scope.images.push(results[i]);
                }

                if (!$scope.$$phase) {
                    $scope.$apply();
                }
            },
            function (error) {
                console.log('Error: ' + error);
            }
        );
    };
});

如您所见，这是我从这里复制的完全相同的控制器，在简单测试项目中它起作用了。

出于某种怀疑的原因，它现在无法工作。我总是收到错误信息：

TypeError: Cannot read property 'getPictures' of undefined

那么这有什么意义呢？我在两个项目中使用了完全相同的代码。一个项目中一切正常，而另一个项目中却一点也不行。我尝试了这里描述的所有示例，但结果总是一样。

- Mulgard

---

你在清单文件中给了应用程序相机访问权限吗？ - LarsBauer

自从3.0版本以后，您再也不需要手动编辑了。所有内容都会自动生成。 - Mulgard

你是否添加了 cordova-imagePicker 插件？如果是，请将其删除并重新安装。我刚刚检查了我的测试应用程序，插件在 iOS 上运行良好，可以选择任意 5 张图片。正在检查 Android... - Tamal

很遗憾，这并没有帮助。 - Mulgard

更新：是的，在Android中也可以运行。 - Tamal

我正在使用这个插件 com.synconset.imagepicker 1.0.6 "ImagePicker"。 - Tamal

Answer 1

我检查了你的项目，发现你的index.html缺少 cordova.js 文件。因此，你的插件都没有被加载或初始化。 只需在你加载 ng-cordova.js 的位置下面添加以下代码即可：

<script src="cordova.js"></script>

- John

---

哇...这是最明显的问题，我竟然三天都没发现。非常感谢你。 - Mulgard

Answer 2

在您的示例中，您正在注入 $cordovaCamera，但是Iconic使用$cordovaImagePicker。另外，在您的示例中，您正在使用来自window对象的imagePicker对象。我认为您不需要window对象。

尝试注入正确的依赖项$cordovaImagePicker，并从中使用方法$cordovaImagePicker.getPictures。

- ThiagoPXP

---

@Mulgard: ThiagoPXP 是正确的。尝试使用 ngCordova 并注入 $cordovaImagePicker 然后使用 $cordovaImagePicker。参考资料在这里。 - LeftyX