Angularjs Firebase 获取数据列表答案

【问题标题】：Angularjs Firebase getting a list of dataAngularjs Firebase 获取数据列表
【发布时间】：2017-07-26 22:22:27
【问题描述】：

我正在尝试从 Firebase 获取数据。我通过练习来更好地学习 Firebase，我的应用就像一个消息应用。

我的问题是，我尝试获取这些消息数据，但由于它们具有唯一的 ID，我无法访问它们。如何联系messagecontents,dates？

这是我的数据库结构：

angularish
    -> <id>
        -> "sender" : "john"
        -> "to" : "sarah"
        -> "date" : "16/09/2016"
        -> "messageContent" : "Something like a long text..."
    -> <id>
        -> "sender" : "john"
        -> "to" : "sarah"
        -> "date" : "16/09/2016"
        -> "messageContent" : "Something like a long text..."
    -> <id>
        -> "sender" : "john"
        -> "to" : "sarah"
        -> "date" : "16/09/2016"
        -> "messageContent" : "Something like a long text..."

这是我的代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test3 Angular</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
    <script src="https://www.gstatic.com/firebasejs/3.4.1/firebase.js"></script>
    <script src="https://www.gstatic.com/firebasejs/3.4.0/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/3.4.0/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/3.4.0/firebase-database.js"></script>
    <!-- Leave out Storage -->
    <!-- <script src="https://www.gstatic.com/firebasejs/3.4.0/firebase-storage.js"></script> -->
    <script>
      // Initialize Firebase
      firebase.initializeApp(config);
    </script>
    <script>
        var app2 = angular.module("theapp",[]);
        app2.controller("generalController",function($scope){

          var database = firebase.database();
          var rootRef = database.ref();
          var subRootRef = rootRef.child("angularish");
          $scope.messages = [];

          rootRef.push({
                "sender":"y",
                "to" : "x",
                "messageContent" : "Something like a long text",
                "date" : "10/06/2016"
          });

          rootRef.on("value",function(snapshot){
            $scope.messages = snapshot.val();
            console.log(snapshot.val());
          });
        });
    </script>
</head>
<body>
    <div class="container" ng-app="theapp" ng-controller="generalController">
        {{ 1+1 }}
        <ul>
            <li ng-repeat="message in messages">
                {{ message.messageContent }}
            </li>
        </ul>
    </div>
</body>
</html>

【问题讨论】：

如果你使用 angularFire 会简单得多
我尝试使用它，但我又不能 :( 我如何在 angularfire 中做到这一点
您可以使用startAt 和endAt firebase.google.com/docs/database/web/… 这是一个示例jsfiddle.net/katowulf/vQEmt/2

标签： javascript angularjs firebase firebase-realtime-database angularfire

【解决方案1】：

您错过了$scope.$apply()，因为您已经超出了角度摘要周期。

rootRef.on("value",function(snapshot){
    $scope.messages = snapshot.val();
    console.log(snapshot.val());
    $scope.$apply();
});

【讨论】：

val() 的结果不也需要转换成数组吗？与ng-repeat合作？
ng-repeat 适用于对象。如果他们想对其进行排序，那么是的，他们将不得不将其转换为数组。示例：jsfiddle.net/kk8gyjt1