Question

我正在使用codepen来构建一个tic tac toe游戏。当我尝试console.log $scope时，它告诉我它没有定义。我相信我拥有所有正确的语法。这是代码链http://codepen.io/theMugician/pen/XXbgBX

var app = angular.module("ticTacToe", []);
app.controller("MainCtrl", ['$scope', function($scope){
  var cell = $(".square");

  $scope.player = "";
  $scope.AI = "";
  $scope.result = "";

  /*** Choose a shape ***/
  $scope.choosePlayer = function(e) {
  $scope.player = $(e.currentTarget).text();
    $('.choose').css('top', '-2000px');
    $('#wrapper').css('top', '-600px');
    $('#wrapper').css('opacity', '1');
    if($scope.player === "X"){
      $scope.AI = "O";
    }else if($scope.player === "O"){
      $scope.AI = "X";
    }  
  }

  /*** Shape Cells ***/
  $scope.cells = [ { value: '', disabled: false }, 
                  { value: '', disabled: false },
                  { value: '' , disabled: false}, 
                  { value: '' , disabled: false },
                  { value: '' , disabled: false},
                  { value: '', disabled: false } ,
    { value: '' , disabled: false}, { value: '', disabled: false }, 
                  { value: '' , disabled: false}  
  ];
  // made a ref to scope cells
  $scope.emptyCells = $scope.cells;
  $scope.filledCells = '';

  /*** Make a move ***/
  $scope.move = function(cell){
    cell.value = $scope.player;
    cell.disabled = true;
    var round = 0;
    function hasValue(element) {
      return element.value === "";
    }
    //check if all cells are filled
      if($scope.cells.some(hasValue)){
         round = 0;
      }else{
        round = 1;
        $scope.filledCells = $scope.cells;
      }
    //AI makes a move 
    while(round < 1){
     // filtered to get only available cells (for performance)
      $scope.emptyCells = $scope.cells.filter(function(cell){
        return cell.value === '';
      });
      // got random cell according to empty cells
      var randomCell =  $scope.emptyCells[Math.floor((Math.random()*($scope.emptyCells.length-1))+1)];
      if(randomCell.value === "" ){
      randomCell.value = $scope.AI;
        randomCell.disabled = true;
      round = 1;
      }else{
        round = 0;
      } 
    }
  $scope.checkResults();
  };

  $scope.checkDraw = function() {
    if($scope.filledCells && $scope.checkWinner.status === false){
      return true;
    }else{
      return false;
    }
  }

  $scope.checkWinner = function() {
    var allCells = $scope.cells;
    var cell = allCells.value;
    var status = false;
    var winningCell = cell;
    if (
        (cell[0] == cell[1] && cell[1] == cell[2]) ||
        (cell[3] == cell[4] && cell[4] == cell[5]) ||
        (cell[6] == cell[7] && cell[7] == cell[8]) ||
        (cell[0] == cell[3] && cell[3] == cell[6]) ||
        (cell[1] == cell[4] && cell[4] == cell[7]) ||
        (cell[2] == cell[5] && cell[5] == cell[8]) ||
        (cell[0] == cell[4] && cell[4] == cell[8]) ||
        (cell[2] == cell[4] && cell[4] == cell[6]) 
        ) {
            status = true;
            winningCell = cell;
        } else {
            status = false;
      }
      return {
        status: status,
        winner: winningCell
      }
}

  //checks if values are the same
  $scope.checkResults = function(){
    var winner = $scope.checkWinner.winner;
    if($scope.checkWinner.status){
      $('#resultsWrapper').css('top', '-600px');
      $('#resultsWrapper').css('opacity', '1');
      $scope.result =  winner + " is the winner";
      $scope.reset();
    }
    if($scope.checkDraw){
      $('#resultsWrapper').css('top', '-600px');
      $('#resultsWrapper').css('opacity', '1');
      $scope.result =  "It's a tie";
      $scope.reset();
    }
  }

$scope.reset = function(){
  $scope.cells = [ { value: '', disabled: false }, 
                  { value: '', disabled: false },
                  { value: '' , disabled: false}, 
                  { value: '' , disabled: false },
                  { value: '' , disabled: false},
                  { value: '', disabled: false } ,
    { value: '' , disabled: false}, { value: '', disabled: false }, 
                  { value: '' , disabled: false}  
  ];
}
}]);

Answer 1

在谷歌浏览器开发者工具中，我在控制台中输入$ scope，它给了我未捕获的ReferenceError：$ scope未定义。另一方面，当我插入console.log（$ scope）;在我的脚本中，它记录$ scope的值。那是为什么？

当您在控制台中输入＆＃34; $ scope时＃34;你是在检查角度代码中的断点还是坐在那里闲置在页面上？

$ scope只有在范围＆＃34;范围内才能检查。在Angular代码中....当你不在断点时，你不能输入$ scope。

$ scope未定义 - codepen

1 个答案: