简体   繁体   中英

AngularJS - Checkbox get the id from checked object

as you can see I have a list of objects in my modal with a checkbox on the right side. Now I want to click the checkbox and only check one single item. Right now when I click on one checkbox, everthing gets checked. But the main thing is that I want to archieve the following:

I want to click on the checkbox and get the id or the team that is checked. Thank you for your help!

This is my modal:

<div class="col-md-12">
    <ul class="list-group">
        <li ng-repeat="team in teams" class="list-group-item">{{ team.allUserTeamName + " - " + team.allUserTeam }}

            <label ng-repeat="(feature,enabled) in features">
                 <input type="checkbox" ng-model="features[feature]"/>
            </label>

        </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>

{{features.value}}

This is my controller:

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

    $scope.selectUsers = 'Users';

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

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

        $scope.features = {
            value: false
        };


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

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

Right now when I click on one checkbox, everthing gets checked.

The model needs to be different for each team :

<div class="col-md-12">
    <ul class="list-group">
        <li ng-repeat="team in teams" class="list-group-item">
            {{ team.allUserTeamName + " - " + team.allUserTeam }}

            <label ng-repeat="(key,value) in features">
                 <input type="checkbox"
                        ng-model="team.key"
                        ng-change="onCheckboxChange(team, key)"
                 />
            </label>

        </li>
    </ul>
</div>

How do I now if the checkbox is true or false ?

$scope.onCheckboxChange = function(team, key) {
     console.log("Change for "+ team.allUserTeamName);
     console.log(key +" changed to "+ team.key);
};

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM