ng-repeat 来自 firebase 的项目答案

【问题标题】：ng-repeat through items from firebaseng-repeat 来自 firebase 的项目
【发布时间】：2016-05-09 03:01:02
【问题描述】：

我正在尝试通过 firebase 中的项目进行 ngrepeat。我在控制台中有它们。但表达式不起作用。我不知道该怎么做，并且已经尝试了一切。任何帮助都会很棒。谢谢

此处为控制台图片：

//js
firebaseRef.once("value", function(snapshot) {
    $timeout(function(){
        $scope.boats = snapshot.val();
        console.log($scope.boats); //image of console up^
    }, function (errorObject) {
        console.log("The read failed: " + errorObject.code);
    },0);
});

//html
     <div class="row pad" ng-repeat="boat in boats">
        <span class='text-center' >{{boat.title}}</span>
     </div>

【问题讨论】：

您确定您的 HTML 内容包含与 firebase 相同的控制器吗？尝试使用{{boats}} 以 HTML 格式打印完整内容。如果不是，那么首先尝试解决该问题。
@VikramTiwari，我只有一个控制器，但 {{boats}} 不工作。任何一个。有什么建议我应该如何处理吗？谢谢
在为船赋值后尝试添加$scope.$apply()。
试试这个教程：firebase.com/docs/web/libraries/angular/…
@clint，一旦我添加应用 {{boats}} 显示，但像 {{boat.title}} 这样的表达式仍然不起作用

标签： javascript angularjs firebase

【解决方案1】：

数据存储为boat.Title，但以boat.title 访问

【讨论】：

【解决方案2】：

@funador 是正确的，你需要boat.Title 而不是boat.title。

但是，您应该考虑使用 AngularFire for Angular 1 让您的生活更轻松一些。

AngularFire 将集合与 Firebase 数据库和 $digest 循环同步。

angular.module('app', ['firebase'])
  .constant('FirebaseUrl', '<my-firebase-app>')
  .controller('MyCtrl', MyController)
  .config(function($firebaseRefProvider, FirebaseUrl) {
     $firebaseRefProvider.registerUrl({
       default: FirebaseUrl,
       boats: FirebaseUrl + '/boats'
     });
  });

function MyController($scope, $firebaseRef, $firebaseArray) {
  $scope.boats = $firebaseArray($firebaseRef.boats);
}

AngularFire 允许您使用$firebaseRefProvider 在config 阶段指定您的引用。然后你就可以注入$firebaseRef 服务了。

$firebaseArray 将自动同步对您的模板所做的更改。要创建一个，请传入 boats 对数组的引用。

这很棒的是不需要$timeout。 AngularFire 为您处理。

而你的ng-repeat 还是一样的：

<div class="row pad" ng-repeat="boat in boats">
  <span class='text-center' >{{boat.title}}</span>
</div>

【讨论】：