0

我正在使用 Visual Studio Tools for Apache Cordova ( TACO ) 构建我的第一个应用程序,并在尝试使用我的第一个 Cordova 插件$cordovaImagePicker 时遇到问题。我正在使用带有 VS Taco 扩展版本 12.0.60401.1 的 Visual Studio 2015 更新 2。

config.xml 设置为使用 Cordova CLI 的 6.0.0 版本,我安装了插件https://github.com/wymsee/cordova-imagePicker.git的 1.1.0 版本。我下面的 index.html 正在引入 angularjs 的 1.4.7 版、ionic.js 的 1.1.0 版和 ng-cordova.js 的 0.1.23-alpha 版。

<!DOCTYPE html>
<html data-ng-app="app">
<head>
    <meta charset="utf-8" />
</head>
<body>
    <div data-ng-view></div>

    <!-- External Libraries -->
    <script src="lib/angular.js"></script>
    <script src="lib/angular-route.js"></script>
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/ng-cordova.js"></script>

    <!-- App -->
    <script src="scripts/app.module.js"></script>
    <script src="scripts/app.js"></script>
    <script src="scripts/home.js"></script>
    <script src="scripts/dashboard.js"></script>

    <!-- Widgets -->
    <script src="scripts/widgets/widgets.module.js"></script>
    <script src="scripts/widgets/zlTypePlaceholder.js"></script>

    <!-- Cordova reference, this is added to your app when it's built. -->
    <!-- ReSharper disable once Html.PathError -->
    <script src="cordova.js"></script>
    <script src="scripts/platformOverrides.js"></script>
</body>
</html>

我正在使用@johnpapa Angular 1风格指南

应用程序.js

(function () {
    "use strict";

    document.addEventListener('deviceready', onDeviceReady.bind(this), false);

    function onDeviceReady() {
        // Handle the Cordova pause and resume events
        document.addEventListener('pause', onPause.bind(this), false);
        document.addEventListener('resume', onResume.bind(this), false);        
    };

    function onPause() {
        // TODO: This application has been suspended. Save application state here.
    };

    function onResume() {
        // TODO: This application has been reactivated. Restore application state here.
    };
})();

app.module.js

(function () {
"use strict";

angular.module('app', [
        'ionic',
        'ngCordova',
        'ngRoute',
        'app.widgets'
    ]);
}

下面在我的dashboard.js 中,当我使用Visual Studio 将此代码调试到我的Android Nexus 5X(Cordova 5.1.0)时,当单击绑定到sendImage()的按钮时出现错误。 无法读取未定义的属性“getPictures”,但 $cordovaImagePicker 是一个显示该方法的对象,当我将其记录到控制台时它会在遇到 $cordovaImagePicker.getPictures(options) 时失败

(function () {
    "use strict";

    angular
        .module('app')
        .controller('Dashboard', Dashboard);

    Dashboard.$inject = ['$scope', '$routeParams', '$cordovaImagePicker', '$ionicPlatform'];

    function Dashboard($scope, $routeParams, $cordovaImagePicker, $ionicPlatform) {
        var vm = this;
        vm.sendImage = sendImage;        

        function sendImage() {
            console.log("sendMessage Clicked");

            //Import Image
            $ionicPlatform.ready(function() {
                console.log($cordovaImagePicker);

                //TODO: Get Image Picker to work
                var options = {
                    maximumImagesCount: 1,
                    width: 150,
                    height: 150,
                    quality: 100
                };
                console.log(options);

                console.log('here we go...');
                $cordovaImagePicker.getPictures(options)
                    .then(function(results) {
                        console.log('it worked!');
                        for (var i = 0; i < results.length; i++) {
                            console.log(results[i]);
                        }
                    }, function(error) {
                        console.log(error);
                    });
            });
        }
    }
})();

我真的很想使用cordova,但如果我无法克服这第一个障碍,我可能会选择Xamarin 路线。我不想轻易放弃,但如果有什么对你有影响的,请告诉我。谢谢!

4

0 回答 0