Question

我正在处理一些firebase树结构，我有点坚持以下问题。

我想通过匹配（在firebase树结构中） ng-repeat 并显示它们。但是如何通过树形结构的firebase数据库重复？

我想要完成的第一件事就是我希望得到团队名称（例如“a”）来重复它。谢谢你的帮助。

这是我的firebase数据库结构：

-matches
   - match1
       -team1: "a"
       -team2: "b"
   - match2
       -team3: "c"
       -team4: "d"

这是我想要实现的视图中ng-repeat的结果：

team1（a）vs team2（b）|| team3（c）vs team4（d）

这是我的控制器：

app.controller('gametableController', ['currentAuth', '$scope', '$location', '$firebaseObject', '$firebaseArray', '$http', function (currentAuth, $scope, $location, $firebaseObject, $firebaseArray, $http) {
    $scope.versus = 'VS';

    // GET MATCHES FROM DB!!
    var ref = firebase.database().ref("matches");
    var matchList = $firebaseObject(ref);

    matchList.$loaded().then(function () {
        $scope.matchList = [];

        angular.forEach(matchList, function (key, obj) {
            $scope.matchList.push({
            // ??
            });
        });

        console.log(matchList)
    });

}]);

我在控制台中得到了这个 - ＆gt;的console.log（matchList）：

- match1
    -team1: "a"
    -team2: "b"
- match2
    -team3: "c"
    -team4: "d"

这是我的看法。

<div class="container">
        <div class="row" ng-repeat="matches in matchList">
            <div class="col-md-12 mrgn">

                <div class="match">

                    <div class="col-md-1 result-input-wrp card-plan-result">1</div>

                    <div class="col-md-3 card-plan card-wrp">

                        <div class="col-md-3 player-team-logo"><img ng-src="https://upload.wikimedia.org/wikipedia/commons/6/6d/FC_Schalke_04_Logo.svg" width="60" height="60" class="table-team-logo"></div>

                        <div class="col-md-9">
                            <div class="col-md-12 player-team-info info-team"><b>FC Schalke 04</b></div>
                            <div class="col-md-12 player-team-info info-user">Your Name</div>
                            <div class="col-md-12 player-team-info info-user">Wins: 1</div>
                        </div>
                    </div>


                    <div class="col-md-4">
                        <div class="versus-text"><b>{{ versus }}</b></div>
                    </div>


                    <div class="col-md-3 card-plan card-wrp">

                        <div class="col-md-3 player-team-logo"><img ng-src="https://upload.wikimedia.org/wikipedia/commons/6/6d/FC_Schalke_04_Logo.svg" width="60" height="60" class="table-team-logo"></div>

                        <div class="col-md-9 ">
                            <div class="col-md-12 player-team-info info-team"><b>FC Schalke 04</b></div>
                            <div class="col-md-12 player-team-info info-user">Your Name</div>
                            <div class="col-md-12 player-team-info info-user">Wins: 1</div>
                        </div>
                    </div>

                    <div class="col-md-1 result-input-wrp card-plan-result">2</div>

                </div>


            </div>
        </div>
    </div>

Answer 1

试试这个：

angular.forEach(matchList, function(match) {
  var matchTeams = [];

  angular.forEach(match, function(team) {
    matchTeams.push(team)
  });

  $scope.matchList.push(matchTeams);
});

并在视图中实现这一点：

<div class="row" ng-repeat="match in matchList">
    {{match[0]}} vs {{match[1]}}
</div>

AngularJS - 来自firebase对象

1 个答案: