Firebase의 비동기로드 이미지 배열

Question

나는 내 이온 프로젝트에 AngularFire를 사용하고 있습니다. 업로드시 사용자 이미지를 변환하고 firebase에 base64 문자열로 저장합니다. 참고 : 각 이미지는 약 60-150KB 정도입니다. 또한 각 사용자는 9 개의 이미지 만 가질 수 있습니다.

현재 사용자 프로필을 방문하면 모든 이미지를 가져올 때까지로드되지 않는 문제가 있습니다. 아래는 데이터 만 $로드가

return $firebaseArray(API.photos.child(userKey)).$loaded(); 

로드 $의 컨트롤러에 전달됩니다 당신이 볼 수 있듯이 중포 기지에서 이미지 데이터의 배열 ..를 가져 오는 서비스입니다 : 해결 약속을 돌려줍니다 때 초기 배열 데이터는 이 데이터베이스에서 다운로드되었습니다. 약속은 $ firebaseArray로 해결됩니다. 그들은 전체 배치를 기다리는 것이 아니라 도착

은 내가 기본적으로 필요한 것은 NG-반복에 추가 할 각 이미지입니다. 나는 이것을 달성 또는 대안이

* 참고 무엇을 할 수 있습니까 : 반환 데이터는 base64strings

Answer 1

의 배열로 구성 참고 중포 기지 지금 file storage 그래서 당신이 할 필요가 없습니다 있습니다. 하지만 그래도 여전히 base64를 사용하고 싶습니까?

// get user 
$scope.user = {name: 'bob', prof_imgs: [43, 44]}; 
// create map to store images 
$scope.img_map = {}; 

// download each image individually and asynchronously 
user.prof_imgs.forEach(function(id){ 
    ref.child('images/'+id).once("value", function(data) { 
    $scope.img_map[id] = data; 
    }); 
}); 

// display with angular 
<img ng-repeat="id in user.prof_imgs" 
    data-ng-src="data:image/png;base64,{{img_map[id]}}" 
    ng-if="img_map[id]"/> 

:

당신이 뭔가를 할 수 있습니다