拍照上传 

 1 vm.actionsheetShow = function() {
 2         // Show the action sheet
 3         var hideSheet = $ionicActionSheet.show({
 4             buttons: [
 5                 { text: '<i class="icon ion-camera"></i>Take Photo' },
 6                 { text: '<i class="icon ion-images"></i>Photo Library' }
 7             ],
 8             //destructiveText: 'Delete',
 9             //titleText: 'Modify your album',
10             cancelText: 'Cancel',
11             cancel: function() {
12                 // add cancel code..
13             },
14             buttonClicked: function(index) {
15                 $rootScope.photo = "";
16                 vm.takePicture(index);
17                 return true;
18             }
19         });
20     };
21 
22     vm.takePicture = function (index) {
23         var source=Camera.PictureSourceType.CAMERA;
24         if(index==0)
25         {
26             source=Camera.PictureSourceType.CAMERA;
27         }
28         else if(index==1)
29         {
30             source=Camera.PictureSourceType.PHOTOLIBRARY;
31         }
32         navigator.camera.getPicture(
33             function (imageURI) {
34                 vm.setPicture(imageURI);
35                 $rootScope.photo = imageURI;
36             },
37             function (message) {
38                 //vm.scrollTop();
39                 //vm.msg_error = message;
40             },
41             {
42                 quality: 50,
43                 destinationType: Camera.DestinationType.DATA_URL,
44                 sourceType: source,
45                 encodingType: Camera.EncodingType.JPEG,
46                 allowEdit: true,
47                 correctOrientation: true,
48                 targetWidth: 768,
49                 targetHeight: 1024,
50                 saveToPhotoAlbum: false
51             });
52     };
53 
54     vm.setPicture = function (imageURI) {
55         if (imageURI == "")
56             return;
57 
58         $ionicLoading.show({template: 'Loading...'});
59         var i = document.getElementById("img_preview");
60         i.src = "data:image/png;base64," + imageURI;
61         document.getElementById("pre_wid").style.display = "block";
62         document.getElementById("div_preview").style.display = "block";
63         $ionicLoading.hide();
64     };
 1 <div class="item" ng-show="photo != ''">
 2                 <div id="pre_wid" style="display: none; height: 150px; width: 100%; margin-top: 15px; margin-bottom: 15px; text-align: center">
 3                     <div id="div_preview" style="display: none;background: #ffffff;" ng-click="vm.viewPhoto()">
 4                         <img id="img_preview" src=""
 5                              style="max-height: 150px"/>
 6                         <!--<i id="preview_close" ng-click="vm.clearPreview()"-->
 7                         <!--class="icon ion-ios-close-outline"-->
 8                         <!--style="font-size: 20px;"></i>-->
 9                     </div>
10                 </div>
11                 <!--<input type="text" ng-model="photo">-->
12             </div>
13             <div class="item">
14                 <button ng-if="vm.product.photoExist" ng-click="vm.viewPhoto()" class="button button-block button-positive">View Photo</button>
15                 <button ng-click="vm.actionsheetShow()" class="button button-block button-positive">Take Photo</button>
16             </div>

记得添加$ionicActionSheet到ionicApp.controller

ionicApp.controller('productCtrl',function($scope,$rootScope,$state,$http,$document,$ionicLoading,$ionicPopup,$timeout,$ionicScrollDelegate,$ionicActionSheet,$ionicModal) {
posted @ 2016-03-10 14:23  fanhq  阅读(224)  评论(0)  编辑  收藏  举报