每两次切换播放器一次JavaScript-AngularJS

Swap player every two turns JavaScript - AngularJS

本文关键字：一次 JavaScript-AngularJS 播放器 两次      更新时间：2023-09-26

我正在使用AngularJS构建一个记分游戏，每两回合切换一次玩家。这个代码第一次起作用，但我想循环使用这个函数来不断切换玩家。这是我的代码：

app.controller('EventController', function($scope){
$scope.score1 = 0;
$scope.score2 = 0;
$scope.playing = true;
$scope.win1 = false;
$scope.lose1 = false;
$scope.win2 = false;
$scope.lose2 = false;
//Counter
$scope.counter = 0;
$scope.totalScore = $scope.score1 + $scope.score2;
$scope.player1 = " Player 1";
$scope.player2 = " Player 2";
$scope.currentplayer = $scope.player1;

    $scope.switchplayer = function(){
        if ($scope.counter % 2 === 0){
            if($scope.totalScore % 2 === 0){
                $scope.currentplayer = $scope.player2;
            } else {
                $scope.currentplayer = $scope.player1;
            }
    }};

  $scope.incrementScore1 = function() {
    $scope.score1++;
    $scope.counter++;
    if ($scope.score1 === 11){
        $scope.playing = false;
        $scope.win1 = true;
        $scope.lose2 = true;
        console.log('Player 1 wins!');
    }
  };
  $scope.incrementScore2 = function() {
    $scope.score2++;
     $scope.counter++;
    if ($scope.score2 == 11){
        $scope.playing = false;
        $scope.win2 = true;
        $scope.lose1 = true;
        console.log('Player 2 wins!');
    }
  };
$scope.reset = function(){
    $scope.score1='0';
    $scope.score2='0';
    $scope.playing = true;
    $scope.win1 = false;
    $scope.lose1 = false;
    $scope.win2 = false;
    $scope.lose2 = false;
};

});
<div class="container" ng-controller='EventController'>
    <h1>Score Keeper</h1>
    <h3>Current Serve:<span>{{currentplayer}}</span></h3>
    <div class="row" ng-class="{'current': playing}">

        <div class="col-md-6" ng-click='incrementScore1();switchplayer()' ng-model='score1' ng-class="{'win1': win1, 'lose1': lose1}">
            <p>{{score1}}</p><br><br><br>
        </div>

        <div class="col-md-6" ng-model='score2' ng-click='incrementScore2();switchplayer()' ng-class="{'win2': win2, 'lose2': lose2}">
        <p>{{score2}}</p><br><br><br>
    </div>
</div>
<button ng-click='reset()'>Reset</button>
</div>

totalScore在您的代码中从未更新，因此使用totalScores的计算是不正确的（它将始终为0）。只需根据当前玩家的情况切换玩家即可。

$scope.switchplayer = function(){
    if ($scope.counter % 2 === 0){
        $scope.currentplayer = $scope.currentplayer === $scope.player2
            ? $scope.player1
            : $scope.player2;
}};

别忘了在重置功能中重置计数器。否则，你可能会在每一个奇数回合都更换玩家。

$scope.counter = 0;

只需使用% 4:

    $scope.switchplayer = function(){
        if($scope.totalScore % 4 >= 2){
            $scope.currentplayer = $scope.player2;
        } else {
            $scope.currentplayer = $scope.player1;
        }
    };

因此，对于作为余数的0和1，player1是当前player，而对于作为余项的2和3，player2是当前player2。在4个循环之后，它从头开始。

相关文章：