AngularJS / AngularFire - 使用 ng-click 传递对象

Question

我有一个模式 (bootstrap)，我从 Firebase 数据库加载对象。现在我添加了一个 ng-Click 到 "select" 一个对象。

我想 select 8 对象和 "collect" 他们。在我收集了这 8 个对象之后，我想将它们传递给另一个 ng-Click。当我点击第二个 ng-Click 时，这 8 个 (selected) 对象被推送到数据库。

你知道如何存档吗？谢谢！

这是我的模态：

 <div class="col-md-12">
                    <ul class="list-group">
                        <li ng-repeat="team in teams" class="list-group-item">{{ team.allUserTeamName + " - " + team.allUserTeam }}
                            <i class="fa fa-plus-circle" aria-hidden="true" ng-init="item.isClicked = false" ng-click="selectMembers(team); item.isClicked =!item.isClicked" ng-class="{clicked : item.isClicked}"></i>
                        </li>
                    </ul>
                </div>

                <div class="modal-footer">
                    <div class="col-md-12">
                        <div class="row pad-team-selection-view">
                            <button class="btn btn-info" ng-click="createGameplanWithSelectedMembers(team)">Spielplan erstellen</button>
                        </div>
                    </div>
                </div>

这是我的控制器：

app.controller('modalCreateGameplanController', ['$scope', '$timeout', '$http', '$firebaseArray', '$firebaseObject', function ($scope, $timeout, $http, $firebaseObject, $firebaseArray) {

$scope.selectUsers = 'Teilnehmer';

$scope.$on('modal', function (event, args) {

    var ref = firebase.database().ref("users");
    var teams = $firebaseObject(ref);

    teams.$loaded().then(function () {
        $scope.teams = [];
        angular.forEach(teams, function (key) {
            $scope.teams.push({
                allUserTeamName: key.firstname,
                allUserTeam: key.team
            });

            $scope.selectMembers = function (key) {
                console.log(key);
            };

            $scope.createGameplanWithSelectedMembers = function () {
                console.log(teams);
            };

        });
    });
});
}]);

Answer 1

在视图中使用 ng-disabled 并使用选定的长度作为禁用按钮的条件。

 <div class="col-md-12">
                <ul class="list-group">
                    <li ng-repeat="team in teams" class="list-group-item">{{ team.allUserTeamName + " - " + team.allUserTeam }}
                        <i class="fa fa-plus-circle" aria-hidden="true" ng-init="item.isClicked = false" ng-click="selectMembers(team); item.isClicked =!item.isClicked" ng-class="{clicked : item.isClicked}"></i>
                    </li>
                </ul>
            </div>

            <div class="modal-footer">
                <div class="col-md-12">
                    <div class="row pad-team-selection-view">
                        <button class="btn btn-info" ng-click="createGameplanWithSelectedMembers(team)" ng-disabled="selectCount==8">Spielplan erstellen</button>
                    </div>
                </div>
            </div>

在控制器中为所选项目保留跟踪器$scope.selectCount

app.controller('modalCreateGameplanController', ['$scope', '$timeout', '$http', '$firebaseArray', '$firebaseObject', function ($scope, $timeout, $http, $firebaseObject, $firebaseArray) {

$scope.selectUsers = 'Teilnehmer';

$scope.$on('modal', function (event, args) {

    var ref = firebase.database().ref("users");
    var teams = $firebaseObject(ref);

    teams.$loaded().then(function () {
       $scope.selectCount=0;
        $scope.teams = [];
        angular.forEach(teams, function (key) {
            $scope.teams.push({
                allUserTeamName: key.firstname,
                allUserTeam: key.team
            });

            $scope.selectMembers = function (key) {
                $scope.selectCount=$scope.selectCount+1;
                console.log(key);
            };

            $scope.createGameplanWithSelectedMembers = function () {
                console.log(teams);
            };

        });
    });
});
}]);

AngularJS / AngularFire - 使用 ng-click 传递对象

AngularJS / AngularFire - Pass Objects with ng-click

javascript

angularjs

firebase

angularfire