angular.js: 11706 TypeError: k ist keine Funktion

Question

Ich benutze ein Modal in meiner App. Dies ist der Teil des Codes im Modal:

<div class="btn-group" ng-repeat='r in range' > 
      <button type="button" class="btn btn-default" style="width:40px" 
      ng-click="score(r);" >{{r}}</button> 
      </div> 

Unten ist die Funktion:

$scope.range=[0,1,2,3,4,5,6,7,8,9,10,11],  
$scope.score=function(scr){ 
      debugger 
      $scope.scored=true 
      $scope.score=scr; 
      console.log(scr) 
     } 

Das Problem, das ich bin vor ist, wenn ich auf einer Schaltfläche einmal klicken, um es genau das Ergebnis in der Konsole druckt . Aber danach, wenn ich auf eine andere Taste noch einmal klicken versuchen dann erhalte ich die folgenden Fehler:

angular.js:11706 TypeError: k is not a function 

Aber wenn ich in der Nähe des modalen und nur, wenn es nicht durch den Fehler. Ich bin ziemlich verwirrt. Ist es wegen des Hebeproblems? Bitte geben Sie mir eine Lösung, wenn jemand hat.

Beispielcode:

function TodoCtrl($scope) { 
 
    $scope.range = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11], 
 
    $scope.score = function(scr) { 
 
     $scope.scored = true 
 
     $scope.score = scr; 
 
     console.log(scr) 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app> 
 
    <div ng-controller="TodoCtrl"> 
 
    <div class="btn-group" ng-repeat='r in range'> 
 
     <button type="button" class="btn btn-default" style="width:40px" ng-click="score(r);">{{r}}</button> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

Das erste Mal, wenn Sie auf die Schaltfläche klicken, wird es die Funktion. Teil der Funktion ist diese Zeile: $scope.score=scr;. Dies weist die Funktion, die früher die Funktion war, neu zu, was auch immer als Argument übergeben wurde. Wenn Sie das zweite Mal auf die Schaltfläche klicken, versucht es den neuen Wert $scope.score auszuführen, aber dieser neue Wert ist keine Funktion, daher gibt es den Fehler, den Sie sehen.

Answer 2

Die problematische Zeile ist:

$scope.score = scr; 

Sie bereits eine Funktion namens Punktzahl hatte. $ scope ist ein Kontext, der die Variable speichert, die im äußeren Bereich definiert ist. Sie haben $ scope.score anstelle einer Funktion neu zugewiesen und es tritt ein JS-Fehler auf.

Ich habe so diese Zeile kommentiert.

function TodoCtrl($scope) { 
 
    $scope.range = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11], 
 
    $scope.score = function(scr) { 
 
     $scope.scored = true 
 
     //$scope.score = scr; 
 
     console.log(scr) 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app> 
 
    <div ng-controller="TodoCtrl"> 
 
    <div class="btn-group" ng-repeat='r in range'> 
 
     <button type="button" class="btn btn-default" style="width:40px" ng-click="score(r);">{{r}}</button> 
 
    </div> 
 
    </div> 
 
</div>