Obtenga una imagen específica después de un clic

Question

Mar 17, 2016, 11:29 AM

Obtenga una imagen específica después de un clic

Tengo una lista, cada uno tiene un botón para invocar la cámara, tomar una foto y guardarla localmente. Cada vez en mi html pude ver todas las imágenes que he tomado.

<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 that are taken by the index of button-->
                    <img ng-repeat="" ng-src="" style="height:50px;"/>        
                </ion-item>
                <ion-item>
                    <!-- All the image taken are showed as a list-->
                    <img ng-repeat="image in images" ng-src="{{urlForImage(image)}}" style="height:50px;"/>  
                </ion-item>

            </ion-list>                  
        </ion-conten>
    </body>

mi 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);
  }

mi archivo de servicio es

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';

    for (var i = 0; i < 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
  }
});

Lo que necesito es que se muestren las imágenes tomadas por el clic específico del botón (índice del botón). Si tomo una foto haciendo clic en el primer botón, esa imagen debe mostrarse junto al primer botón y no en ningún lugar de esos 5 elementos. El sexto elemento tiene la lista completa de todas las imágenes tomadas si alguien me puede ayudar.