Javascript 未定义$scope-代码笔

我正在使用codepen构建一个tic-tac-toe游戏。当我尝试console.log

$scope

时，它告诉我它没有定义。我确信我有所有正确的语法。这是代码笔链接

var-app=angular.module（“ticTacToe”，[]）；
app.controller（“MainCtrl”、[“$scope”、函数（$scope）{
变量单元格=$（“.square”）；
$scope.player=“”；
$scope.AI=“”；
$scope.result=“”；
/***选择一个形状***/
$scope.choosePlayer=函数（e）{
$scope.player=$（e.currentTarget）.text（）；
$（'.choose'）.css（'top'，'-2000px'）；
$（'#wrapper'）.css（'top'，'-600px'）；
$（'#wrapper'）.css（'opacity'，'1'）；
如果（$scope.player==“X”）{
$scope.AI=“O”；
}else if（$scope.player==“O”）{
$scope.AI=“X”；
}  
}
/***形状细胞***/
$scope.cells=[{value:''，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{value:''，禁用：false}，{value:''，禁用：false}，
{值：“”，已禁用：false}
];
//对范围单元格进行了引用
$scope.emptyCells=$scope.cells；
$scope.filledCells=''；
/***采取行动***/
$scope.move=函数（单元格）{
cell.value=$scope.player；
cell.disabled=true；
var round=0；
函数值（元素）{
返回元素。值==“”；
}
//检查是否所有单元格都已填充
if（$scope.cells.some（hasValue））{
四舍五入=0；
}否则{
轮=1；
$scope.filledCells=$scope.cells；
}
//艾未未采取行动
while（圆形<1）{
//过滤以仅获取可用单元格（用于性能）
$scope.emptyCells=$scope.cells.filter（函数（单元格）{
返回cell.value==''；
});
//根据空单元格获取随机单元格
var randomCell=$scope.emptyCells[Math.floor（（Math.random（）*（$scope.emptyCells.length-1））+1]；
如果（randomCell.value==“”）{
randomCell.value=$scope.AI；
randomCell.disabled=真；
轮=1；
}否则{
四舍五入=0；
} 
}
$scope.checkResults（）；
};
$scope.checkDraw=函数（）{
if（$scope.filledCells&&$scope.checkWinner.status===false）{
返回true；
}否则{
返回false；
}
}
$scope.checkWinner=函数（）{
var allCells=$scope.cells；
var cell=allCells.value；
var状态=假；
var winningCell=单元格；
如果(
（单元格[0]==单元格[1]&单元格[1]==单元格[2]）||
（单元格[3]==单元格[4]&单元格[4]==单元格[5]）||
（单元格[6]==单元格[7]&单元格[7]==单元格[8]）||
（单元格[0]==单元格[3]&&cell[3]==单元格[6]）||
（单元格[1]==单元格[4]&单元格[4]==单元格[7]）||
（单元格[2]==单元格[5]&&cell[5]==单元格[8]）||
（单元格[0]==单元格[4]&&cell[4]==单元格[8]）||
（单元格[2]==单元格[4]&&cell[4]==单元格[6]）
) {
状态=真；
winningCell=单元格；
}否则{
状态=假；
}
返回{
状态：状态，
获奖者：winningCell
}
}
//检查值是否相同
$scope.checkResults=函数（）{
var winner=$scope.checkWinner.winner；
if（$scope.checkWinner.status）{
$（'#resultswapper'）.css（'top'，'-600px'）；
$（'#resultswapper'）.css（'opacity'，'1'）；
$scope.result=winner+“是赢家”；
$scope.reset（）；
}
如果（$scope.checkDraw）{
$（'#resultswapper'）.css（'top'，'-600px'）；
$（'#resultswapper'）.css（'opacity'，'1'）；
$scope.result=“这是一个平局”；
$scope.reset（）；
}
}
$scope.reset=函数（）{
$scope.cells=[{value:''，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{值：“”，已禁用：false}，
{value:''，禁用：false}，{value:''，禁用：false}，
{值：“”，已禁用：false}
];
}
}]);

---

在GoogleChromeDeveloperTools中，我在控制台中输入$scope，它给出了未捕获的引用错误：$scope未定义。另一方面，当我插入console.log（$scope）时；它将$scope及其值记录到我的脚本中。为什么呢

当您在控制台中输入“$scope”时，您是在检查角度代码中的断点，还是在页面上处于空闲状态

---

$scope仅在角度代码中处于“范围内”时才可检查。。。。不在断点时不能键入$scope。

Where？哪一行的

$scope

是未定义的？不要只是粘贴代码，解释问题，或者只暴露问题所在的方法。我没有看到控制台。登录google chrome developer tools我在控制台中输入

$scope

，它会给我

未捕获的引用错误：$scope未定义

。另一方面，当我插入

console.log（$scope）时

在我的脚本中记录

$scope

及其值。为什么呢？

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}  
  ];
}
}]);