Firebaseのアイテムが角型グリッドに表示されない

Question

Firebaseからアイテムを取得するときに、アイテムがthis gridに表示されるのが難しくなります。静的配列を返したカスタムサービスで動作させることができました。

私はJSONとしてログアウトすることができるので、データがブラウザに届いていることは知っています。

<pre> 
{{ data | json }} 
</pre> 

HTMLは

<ul class="dynamic-grid" angular-grid="pics" grid-width="300" gutter-size="10" angular-grid-id="gallery" refresh-on-img-load="false" > 
    <li data-ng-repeat="item in data" class="grid"> 
     <img src="{{item.url}}" class="grid-img" data-actual-width = "{{item.width}}" data-actual-height="{{item.height}}" /> 
    </li> 
</ul> 

ただし、項目がビューに表示されていない、または私は、彼らがあるが、それは静的配列と同じように角度グリッドとそのCSSが動作していないと言うべきで。 コードの主要部分は次のとおりです。

コントローラ

var list = iService.getItems().$loaded() 
    .then(function(list) { 
    var cnt = list.length; 
    //console.log("cnt ", cnt); 

    angular.forEach(list,function(image,index){ 
     //console.log('Item: ', list[index]); 

     var imageTemp = new Image(); 
     imageTemp.onload = function(){ 
     list[index].height = this.height + 'px'; 
     list[index].width = this.height + 'px'; 

     }; 
     imageTemp.src = image.url; 

     cnt-- 
     // test to see if all items have been iterated before setting $scope.data 
     if(!cnt){ 
     console.log("done....", cnt); 
     console.log("ere ", list); 
     $scope.data = list; 
     } else { 
     console.log("Current cnt ", cnt); 
     } 

    }); 

JSONにもかかわらず表示されますが、まだ表示されて何もありません。ちなみに、Angular-Gridクラス.grid-imgは、opacity:0とvisibility:hiddenです.devツールで無効にすると、Firebaseのアイテムが表示されますが、Angular-Gridのサイズ変更/スタイリングは表示されません。

これはおそらくそれを達成する最良の方法ではありませんが、私は実験しており、静的な配列ではなくFirebaseからのデータが違いを生むべきではないと感じています。誰でもここで何がうまくいかないのか知っていますか？すべての助けがありがたいです。ありがとう！

Answer 1

documentationの例では、コントローラのul属性にはangular-grid="pics"、コントローラには$scope.pics=...が使用されています。

角度グリッド=「写真」は、

を聴きたいモデルを定義します。しかし、あなたは$scope.dataを設定しています。何か違いはありますか？