Question

我是firebase的新手，我正在尝试使用Firebase源代替$ http.get调用Angularjs翻译一个简单的“loadData”按钮，以便测试我的数据源。

基本上我正在尝试创建这样的内容：onclick Load data从JSON Firebase DM中提取数据。但是我在翻译问题上遇到了麻烦，特别是当我在一个已经在一个大文件中加载控制器的大项目中这样做时：

controllersModule.controller('BlogCtrl', ["$scope", "$firebaseArray",
  function($scope, $firebaseArray) {
  var ref = new Firebase("https:<DATASOURCE>.firebaseio.com/");

  //Nothing Happens
  $scope.loadPosts = function(){
  $scope.Posts = $firebaseArray(ref);
}
  //This Prints in The Console
  ref.on("value", function(snapshot) {
    console.log(snapshot.val());
  },
    function (errorObject) {
      console.log("The read failed: " + errorObject.code);
    });
}]);

范围并没有给我很多线索，除了以下内容： TypeError: $firebaseArray(...).success is not a function 我确实在页面中有我的依赖项，包括angular ire和firebase以及我的角度应用程序的par（所有在单独的文件中）。 Posts.html视图包含以下内容：

 //EDITED: Added an ng-repeat for posts
 <button ng-click="loadPosts()">Load Posts</button>
 <div ng-repeat="post in Posts">
    <h3>{{post.Title}}</h3>
    <p>{{post.Body}}</p>
 </div>

State提供者构建我的控制器并将其推送到索引页面中的ng-view：

 .state('Blog', {
    url: '/blog',
    controller: 'BlogCtrl as posts',
    templateUrl: 'Posts.html',
    title: 'Blog'
  })

我的猜测是我使用上面的函数进行了一些错误的引用调用，但是不知道如何用firebase等效替换它们。有人可以帮忙吗？

Answer 1

AngularFire有detailed documentation，您应该仔细阅读。如错误所述，$firebaseArray没有success()方法。最简单的解决方案是：

$scope.loadPosts = function() {
  $scope.Posts = $firebaseArray(ref);
};

如果要添加错误处理，请使用$loaded()。

$scope.loadPosts = function() {
  $firebaseArray(ref).$loaded().then(function(posts) {
    $scope.Posts = posts;
  }, function(error) {
    alert("The Data is not loading");
  });
};

带有firebase的简单加载数据按钮

1 个答案: