Firebase 加载 $scope 视图输入不加载答案

【问题标题】：Firebase loading $scope view enter doesn't loadFirebase 加载 $scope 视图输入不加载
【发布时间】：2016-07-31 15:33:44
【问题描述】：

我在 Firebase 中遇到了加载问题。我想在打开视图时显示图像列表，但在我返回之前什么都没有发生（有一个闪光灯，我可以看到我的照片列表）。它正在工作，但未在开头显示。
请问我错过了什么？

这是我的控制器视图的开头：

'Use Strict';
angular.module('App').controller('valider_photosController', function($scope, $state, $localStorage, Popup, Firebase, $firebaseObject, $ionicHistory, $ionicPopup, $ionicModal, $cordovaCamera) {

  $scope.imagestab = [];
  var ref_logements = firebase.database().ref('logements');
  var ref_images = firebase.database().ref('images');

  ref_logements.child(id_logement).child('images').on('child_added', added);

  function added(idxSnap, prevId){
      ref_images.child(idxSnap.key).once('value', function(datasnap){
          var bidule = datasnap.val();
          bidule['key'] = datasnap.key;
          $scope.imagestab.push(bidule);
          console.log('La valeur'+datasnap.key+'donne '+datasnap.val());
      });
  }; 

});

【问题讨论】：

标签： angularjs firebase

【解决方案1】：

由于 firebase 使用异步调用，所以当 firebase 响应您的数据时，角度周期已经结束，您的范围不会更新。你可以使用$scope.$apply();强制它。

ref_images.child(idxSnap.key).once('value', function(datasnap){
      var bidule = datasnap.val();
      bidule['key'] = datasnap.key;
      $scope.imagestab.push(bidule);
      $scope.$apply();
});

有一个工具可以集成 angular 和 firebase，您不必担心应用范围等事情。它称为angularfire。我完全建议您开始在您的应用程序中使用它。

使用 angularfire，您只需使用即可获取数据

$scope.bidule = $firebaseObject(ref_images.child(idxSnap.key));

或

$scope.images = $firebaseArray(firebase.database().ref('images'));

【讨论】：

你是对的！ Angularfire 是完美的，谢谢...再次:)

【解决方案2】：

我创建了一个工厂

.factory('Firebase', function ($firebaseArray, $firebaseObject) {
        var ref = firebase.database().ref();
        return {
            all: function (section) {
                var data = $firebaseArray(ref.child(section));
                return data;
            },
            getById: function (section, id) {
                var data = $firebaseObject(ref.child(section).child(id));
                return data;
            },
            get: function (section, field, value) {
                var data = $firebaseArray(ref.child(section).orderByChild(field).equalTo(value));
                return data;
            }
      };
  })

然后在我的控制器中，我像你说的那样替换了：

        var ref_logements = firebase.database().ref('logements');
        var ref_images = firebase.database().ref('images');
        ref_logements.child(index2).child('images').on('child_added', added);

        function added(idxSnap, prevId) {
            var monimage = Firebase.getById('images', idxSnap.key);
            $scope.imagestab.push(monimage);
        };

它就像一个魅力！再次感谢你:)

【讨论】：

Whaouu，我真的要感谢 @adolfosrs，因为我用 angularFire 更改了我的应用程序中的所有引用，现在它真的非常快速和干净。