angularjs - Get specific image after a click -
i have list each has button invoke camera take picture , save locally. every time in html able view images have taken.
<body ng-app="starter"> <ion-content class="has-header padding" ng-controller="imagecontroller"> <ion-list> <ion-item can-swipe="true" ng-repeat="prod in items"> {{prod.name}} <button class="button button-small button-energized" ng-click="addimage($index)">add image</button> <!-- view image taken index of button--> <img ng-repeat="" ng-src="" style="height:50px;"/> </ion-item> <ion-item> <!-- image taken showed list--> <img ng-repeat="image in images" ng-src="{{urlforimage(image)}}" style="height:50px;"/> </ion-item> </ion-list> </ion-conten> </body> my js
$scope.addimage = function($index,type) { //$scope.hidesheet(); console.log("index",$index); imageservice.handlemediadialog(type).then(function() { //$scope.$apply(); }); $scope.images = fileservice.images(); console.log($scope.images) var filename = $scope.images; var productid = $index; console.log("filename",filename); console.log("productid",productid); localstorage.setitem("filename", json.stringify(filename)); localstorage.setitem("productid", json.stringify(productid)); console.log("filename after localstorage",filename); console.log("productid after localstorage",productid); } my service file is
angular.module('starter') .factory('fileservice', function() { var images; var image_storage_key = 'images'; function getimages() { var img = window.localstorage.getitem(image_storage_key); if (img) { images = json.parse(img); } else { images = []; } return images; }; function addimage(img) { images.push(img); window.localstorage.setitem(image_storage_key, json.stringify(images)); }; return { storeimage: addimage, images: getimages } }) .factory('imageservice', function($cordovacamera, fileservice, $q, $cordovafile) { function makeid() { var text = ''; var possible = 'abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz0123456789'; (var = 0; < 5; i++) { text += possible.charat(math.floor(math.random() * possible.length)); } return text; }; function optionsfortype(type) { var source; switch (type) { case 0: source = camera.picturesourcetype.camera; break; case 1: source = camera.picturesourcetype.photolibrary; break; } return { destinationtype: camera.destinationtype.file_uri, sourcetype: source, allowedit: false, encodingtype: camera.encodingtype.jpeg, popoveroptions: camerapopoveroptions, savetophotoalbum: false }; } function savemedia(type) { return $q(function(resolve, reject) { var options = optionsfortype(type); $cordovacamera.getpicture(options).then(function(imageurl) { var name = imageurl.substr(imageurl.lastindexof('/') + 1); var namepath = imageurl.substr(0, imageurl.lastindexof('/') + 1); var newname = makeid() + name; $cordovafile.copyfile(namepath, name, cordova.file.datadirectory, newname) .then(function(info) { fileservice.storeimage(newname); resolve(); }, function(e) { reject(); }); }); }) } return { handlemediadialog: savemedia } }); what need images taken specific(index of button) button click should displayed. if take picture clicking 1st button image should displayed next 1st button , not anywhere in 5 items. 6th item has whole list of images taken me.
Comments
Post a Comment