如何在AngularJS中顯示玩家轉向？

初學程序員在這裏。在我的控制器構造函數中，我有：如何在AngularJS中顯示玩家轉向？

vm.turnCounter = 0; 
vm.turn = getTurn(); 

function getTurn() { 
      if (vm.turnCounter % 2 == 0) { 
       return 'Player 1'; 
      } else { 
       return 'Player 2'; 
      } 
     }

vm是我的捕獲變量，我沒有使用$ scope。我試圖用{{ctrl.turn}}顯示當前轉角，但到目前爲止vm.turnCounter的變化對{{ctrl.turn}}沒有影響，它總是顯示「Player 1」。我在這裏錯過了一些Angular數據綁定概念嗎？謝謝。

這裏是整個控制器，我省略了超長getBoards()，因爲它只是一個多頭排列我會在火力點：

(function() { 
    angular 
     .module('APP') 
     .controller('TicTacToeCtrl', TicTacToeCtrl); 

    function TicTacToeCtrl() { 
     var vm = this; 

     vm.addPiece = addPiece; 
     vm.boards = getBoards(); 
     vm.turnCounter = 0; //encapsulate this 
     vm.turn = 'Player 1'; 
     vm.getTurn = getTurn(); 

     function addPiece(obj) { 
      if (obj.p1 || obj.p2) 
       obj.p1 = true; 
      vm.turnCounter++; 
     } 

     function getTurn() { 
      if (vm.turnCounter % 2 == 0) { 
       return 'Player 1'; 
      } else { 
       return 'Player 2'; 
      } 
     } 
    } 
})();

來源

2015-03-31 2paws

那麼，如果你希望你的視圖能夠訪問它，你需要使用$ scope。發佈您的整個控制器代碼 – Ronnie 2015-03-31 17:36:29

謝謝，我剛剛發佈了我的完整控制器。 – 2paws 2015-03-31 17:43:03

什麼是'vm'，爲什麼你不想使用$ scope？ – Ronnie 2015-03-31 17:54:44

下面是一個簡單的答案：http://jsfiddle.net/jd96d6kr/

爲了讓您的要知道發生了什麼，你將不得不使用$scope。這是角度數據綁定的重點。更改var vm到$scope.vm

<body ng-app="APP"> 
<div ng-controller="TicTacToeCtrl"> 
    <button ng-click="next()">Next</button> 
    turn is {{vm.turn}} 
</div>

(function() 
{ 
    angular 
    .module('APP',[]) 
    .controller('TicTacToeCtrl', function($scope) 
    { 
    $scope.vm = this; 
    $scope.vm.addPiece = $scope.addPiece; 
    $scope.vm.turnCounter = 0; 
    $scope.vm.turn = 'Player 1'; 

    $scope.addPiece = function(obj) 
    { 
     if (obj.p1 || obj.p2) 
     obj.p1 = true; 
     $scope.vm.turnCounter++; 
    } 

    $scope.getTurn = function() 
    { 
     console.log($scope.vm.turnCounter); 
     return ($scope.vm.turnCounter % 2 == 0) ? 'Player 1' : 'Player 2'; 
    } 

    $scope.next = function() 
    { 
     $scope.vm.turnCounter++; 
     $scope.vm.turn = $scope.getTurn(); 
    } 
    }); 
})();

我不知道什麼addPiece()呢，所以我真的沒有做很多這一點。

來源

2015-03-31 18:03:14 Ronnie

非常感謝羅尼，工作很棒！我用$ scope學習了Angular，但是我按照以下建議從它進行了轉換：https://github.com/johnpapa/angular-styleguide 感謝您的幫助！ – 2paws 2015-03-31 18:06:57

該指南的哪一部分建議不要使用範圍？我可以按Ctrl-F來做什麼？ – Ronnie 2015-03-31 18:14:42

「controllerAs View Syntax」會找到它。我最終在沒有$ scope的情況下解決了這個問題，但是當控制器構造函數被調用時，它會調用我的函數來更改爲player 2.小問題，沒有什麼大不了的。 – 2paws 2015-03-31 18:26:40

如何在AngularJS中顯示玩家轉向？

回答

相關問題