Ngcordova相机图像列表中的数组



我需要将我的base64字符串推入空数组,以便我可以在$http post中使用它。我不明白我什么时候犯了错。当我使用home://inspect/#device时,我得到错误:-No Content-Security-Policy meta tag found。请在使用cordova-plugin-whitelist插件时添加一个,照片拍摄后,我得到net::ERR_FILE_NOT_FOUND,但我可以列出我的照片

<ion-header-bar class="bar-stable">
    <h1 class="title">OB3 SNAPSHOT</h1>
    <button class="button button-clear button-large ion-ios-camera" style="align:right" ng-click="takePicture()"></button>
</ion-header-bar>
<ion-content>
    <img ng-show="imgURI !== undefined" ng-src="{{imgURI}}">
    <img ng-show="imgURI === undefined" ng-src="http://placehold.it/300x300">
    <!--<button class = "button" ng-click="takePicture()">Take Picture</button>-->
    <ul class="list">
        <li class="item" ng-repeat="i in myImage">
            <img ng-src="{{baseURL+i}}" ng-click="clickImage()">
        </li>
    </ul>
</ion-content>

AngularJS

exampleApp.controller("ExampleController", function($scope, $cordovaCamera) {
    $scope.myImage = [];
    $scope.baseURL = 'data:image/jpeg;base64,';
    $scope.clickImage = function() {
        var postObject = {
            data: {
                "width": 32,
                "height": 32,
                "mimetype": "image/png",
                "name": "Image",
                "bindaryData": $scope.myImage[0]
            }
        }
        $http.post(" url",
                postObject)
            .success(function(response) {
                $scope.names = response.response.data;
                console.log(response);
                console.log(response.response.data);
            })
        .error(function(response) {
            console.log(response);
            alert('post is error');
        });
    };

    $scope.takePicture = function() {
        navigator.camera.getPicture(onSuccess, onFail, {
            quality: 75,
            targetWidth: 320,
            targetHeight: 320,
            destinationType: 0
        });
        function onSuccess(imageData) {
            $scope.imgURI = imageData;
            $scope.myImage.push($scope.imgURI);
            $scope.$apply();
        }
        function onFail(message) {
            alert('Failed because: ' + message);
        }
    };
});

实际上是$作用域的压入。imgURI工作得很好。但是你的观点没有更新。请照两张照片。然后你就能明白你的问题了。通过添加 $scope.$apply( 将解决您的问题

试试这段代码,

控制器

$scope.myImage = [];
$scope.baseURL = 'data:image/jpeg;base64,';
$scope.takePhoto = function() {
     navigator.camera.getPicture(onSuccess, onFail, {
         quality: 75,
         targetWidth: 320,
         targetHeight: 320,
         destinationType: 0
     });
     function onSuccess(imageData) {
         $scope.imgURI = imageData;
         $scope.myImage.push($scope.imgURI);
         $scope.$apply();
     }
     function onFail(message) {
         alert('Failed because: ' + message);
     }
};

<button ng-click="takePhoto()">Capture</button>
<li ng-repeat="i in myImage">
    <img ng-src="{{baseURL+i}}">
</li>

引用

最新更新