2014-09-25 4 views
0

Prettyphoto перестал работать после того, как я изменил HREF URL угловому тег: {{something.uri}}угловой и prettyphoto URL из blobstorage

Javascript:

jQuery(".prettyphoto").prettyPhoto({ 
    theme: 'pp_default', 
    overlay_gallery: false, 
    social_tools: false, 
    deeplinking: false, 
    theme: 'dark_rounded' 
}); 

$("a[rel^='prettyPhoto']").prettyPhoto(); 

HTML:

<div ng-show="model.fileList" ng-repeat="fileList in model.fileList"> 
    <a ng-href="{{fileList.uri}}" class="prettyphoto"> 
     <img ng-src="{{fileList.uri}}" class="img-thumbnail" width="100" alt="" /> 
    </a> 
</div> 

Угловая области видимости от blobstorage :

fileList: [ 
    {  
     parentContainerName: documents  
     uri: https://xxxxxx.blob.core.windows.net/documents/20140702.jpg  
     filename: 20140702.jpg  
     fileLengthKilobytes: 293  
    } 
] 
+0

Что такое "модель"? Я не вижу этого в любом уголке. – sma

+0

Модель полная модель выглядит следующим образом: модель: { FileList: [] roundProgressData: { метки: 0 процент: 0 } } Здесь без данных в FileList –

+0

Вы можете уточнить свой ответ добавив всю эту информацию там? – sma

ответ

0
app.factory('storageService', 
["$http", "$resource", "$q", 
    function ($http, $resource, $q) { 
     //resource to get summaryRoles 
     var resourceStorageManager = $resource('/api/storageManager/:id', { id: '@id' }); 
     return { 
      getFileList: function() { 
       var deferred = $q.defer(); 
       resourceStorageManager.query(, function (data) { 
        deferred.resolve(data); 
       }, function (status) { 
        deferred.reject(status); 
       } 
      ); 
       return deferred.promise; 
      } 
     }; 
}]); 



app.controller('startController', ['$scope', '$http', '$timeout', '$upload', 'storageService', 'settings', 
function startController($scope, $http, $timeout, $upload, storageService, settings, profileRepository, notificationFactory, $q) { 

    $http.defaults.headers.common = { 'RequestVerificationToken': $scope.__RequestVerificationToken }; 

    $scope.model = {}; 

    $scope.model.fileList = null; 

    $scope.model.roundProgressData = { 
     label: 0, 
     percentage: 0.0 
    }; 

    $scope.$on("pic_profileone_main", function (event, profileExtInfo1) { 
     $scope.changeprofilepicmodel1 = angular.copy(profileExtInfo1); 
     refreshServerFileList(); 
    }); 

    $scope.$on("pic_profiletwo_main", function (event, profileExtInfo2) { 
     $scope.changeprofilepicmodel2 = angular.copy(profileExtInfo2); 
     refreshServerFileList2(); 
    }); 

    $scope.onFileSelect = function ($files, callernumber, foldername, blobtype) { 
     if (callernumber == 1) { 
      $scope.blobModel = angular.copy($scope.changeprofilepicmodel1); 
      $scope.blobModel.folderName = foldername; 
      $scope.blobModel.blobTypeCode = blobtype; 
     } else if (callernumber == 2) { 
      $scope.blobModel = angular.copy($scope.changeprofilepicmodel2); 
      $scope.blobModel.folderName = foldername; 
      $scope.blobModel.blobTypeCode = blobtype; 
     } 
     $scope.selectedFiles = []; 
     $scope.model.progress = 0; 


     // Assuming there's more than one file being uploaded (we only have one) 
     // cancel all the uploads 
     if ($scope.upload && $scope.upload.length > 0) { 
      for (var i = 0; i < $scope.upload.length; i++) { 
       if ($scope.upload[i] != null) { 
        $scope.upload[i].abort(); 
       } 
      } 
     } 


     $scope.upload = []; 
     $scope.uploadResult = []; 
     $scope.selectedFiles = $files; 

     // Ok, we only want one file to be uploaded 
     // let's take the first one and that's all 
     var $file = $files[0]; 

     // Only first element, single file upload 
     (function (index) { 
      $scope.upload[index] = $upload.upload({ 
       url: settings.constants.uploadURL, 
       headers: { 'myHeaderKey': 'myHeaderVal' }, 
       method: 'POST', 
       data: $scope.blobModel, 
       file: $file, 
       fileFormDataName: 'myFile' 
      }).then(function (response) { 
       var look = response; 
       $scope.model.progress = 100; 

       // you could here set the model progress to 100 (when we reach this point we now that the file has been stored in azure storage) 

       $scope.uploadResult.push(response.data); 
       $scope.$emit('ClearUploadPics'); 
       refreshServerFileList(); 
      }, null, function (evt) { 

       // Another option is to stop here upadting the progress when it reaches 90% 
       // and update to 100% once the file has been already stored in azure storage 
       $scope.model.progress = parseInt(100.0 * evt.loaded/evt.total); 

       $scope.model.roundProgressData.label = $scope.model.progress + "%"; 
       $scope.model.roundProgressData.percentage = ($scope.model.progress/100); 
      }); 
     })(0); 

    }; 


    function refreshServerFileList() { 
     storageService.getFileList().then(function (data) { 
      $scope.model.fileList = data; 
     } 
     ); 
    } 


    function initialize() { 
     refreshServerFileList(); 
    } 


    initialize(); 

    $scope.$on("ClearProgressBar", function (event) { 
     $scope.selectedFiles = null; 
    }); 

}]); 

Надеюсь, что все в порядке и доступно для чтения.