【问题标题】:Get both the parent and child values in Firebase Database with AngularJS使用 AngularJS 获取 Firebase 数据库中的父值和子值
【发布时间】:2017-07-22 11:42:13
【问题描述】:

我正在使用一些 AngularJS 在我的 Firebase 数据库中检索指定父树下的值。我也想得到这个父母的价值。

我的数据库结构:

到目前为止,我的代码获取了指定 UserID 下每个 tripID 的 Name 和 PhotoUrl。但我想获取 TripID 值以及 Name 和 PhotoUrl。问题是 TripID 值不在子树中。我怎样才能找回它?

我的 JS 看起来像这样:

    var app = angular.module('test', []);

app.controller('MainCtrl', function($scope) {
    var database = firebase.database();
    database.ref(`trips/${userid}/trips`).once('value') 

.then(photosSnap => {
    var photosObj = photosSnap.val();
    var tripName = Object.keys(photosObj).map(key => photosObj[key].name);
    var tripPhotoUrl = Object.keys(photosObj).map(key => photosObj[key].photourl);

   $scope.repeatData = tripName.map(function (value, index) {
      return {
        data: value,
        value: tripPhotoUrl[index]
}
});

【问题讨论】:

    标签: javascript angularjs firebase-realtime-database


    【解决方案1】:

    不确定我是否理解正确,但如果您想要一份旅行钥匙列表:

    var tripKeys = Object.keys(photosObj);
    

    但是将单独的值提取到数组中然后重新组合对我来说感觉过于复杂。您只需循环一次行程即可获取所需的所有数据:

    var trips = photosSnap.val();
    $scope.repeatData = Object.keys(trips).map((key) => {
        tripKey: key,
        tripName: trips[key].name,
        tripPhotoUrl: trips[key].photourl
    });
    

    或者不需要Object.keys():

    var trips = [];
    photosSnap.forEach((trip) => {
      trips.push({
        tripKey: trip.key,
        tripName: trip.val().name,
        tripPhotoUrl: trip.val().photourl
      });
    });
    $scope.repeatData = trips;
    

    不幸的是,最后一点需要一个临时变量,因为 Firebase 的 DataSnapshot 类没有 map() 函数。

    【讨论】:

    • 感谢您的回答。在带有 Object.keys() 的第二个代码 sn-p 中,我的值是否存储在 tripKey、tripName 和 tripPhotoUrl 中?因为在我上面的代码中,在 html 中,我设置了 ng-repeat="data in repeatData",并且我使用了 {{data.data}} 和 {{data.value}} 来显示输出。
    • 我在我的代码中使用了更具描述性的名称,希望它会更清晰。您可以在代码中使用 {{data.tripKey}} 来获取旅行密钥,{{data.tripName}} 是旅行名称,{{data.tripPhotoUrl}} 是旅行照片 URL。
    • 这就是我的想法,尽管在我的 HTML 代码中插入它时,运行代码时没有任何显示。
      {{data.tripName}}
      这是一个带有代码的 jsfiddle:jsfiddle.net/vnm1fnjh
    • 您会注意到我故意没有包含我的 firebase 凭据,并且用于访问数据库中行程的 userid 变量也丢失了。当我使用所有这些信息在我的计算机上运行它时,我得到与 jsfiddle 相同的结果
    • 我无法运行代码,因此很难提供帮助。我在 this fiddle 中包含了一个数据库 URL,并授予您对 /45254134 的写入权限。如果你能用它重现它,请告诉我。
    猜你喜欢
    • 2018-11-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-04-01
    • 1970-01-01
    • 2020-06-06
    • 2018-04-08
    • 2020-04-27
    相关资源
    最近更新 更多