javascript - AngularJS / AngularFire - Pass Objects with ng-click -
i have modal (bootstrap) load objects firebase database. added ng-click "select" object.
i want select 8 object , "collect" them. after collected these 8 objects, want pass them ng-click. when click on second ng-click these 8 (selected) objects pushed database.
do have idea how archive that? thank you!
this modal:
<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>
this controller:
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); }; }); }); }); }]);
in view use ng-disabled
, use selected length condition disable button .
<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>
in controller keep tracker selected items $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); }; }); }); }); }]);
Comments
Post a Comment