AngularJS編輯按鈕僅工作一次，然后出現TypeError：l不是函數

Question

我目前正在學習AngularJS，並且正在構建通訊簿。 我有一個編輯按鈕，該按鈕在第一次使用時效果很好，但在下一次則無法正常工作。 它僅顯示此錯誤，我不理解。

TypeError: l is not a function
at angular.js:12234
at f (angular.js:22824)
at k.$eval (angular.js:14287)
at k.$apply (angular.js:14385)
at HTMLButtonElement.<anonymous> (angular.js:22829)
at HTMLButtonElement.dispatch (jquery-3.1.1.min.js:3)
at HTMLButtonElement.q.handle (jquery-3.1.1.min.js:3)
(anonymous) @ angular.js:11496

這是我的最小代碼。

 <html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <script type="text/javascript" src="//code.jquery.com/jquery-3.1.1.min.js"></script> <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js"></script> </head> <body ng-app="MyApp"> <div ng-controller="studentContoller" class="container"> <h1> List of places</h1> <table class="table table-striped"> <thead> <tr> <th>#</th> <th>Name</th> <th>Address</th> <th>Postal code</th> <th>City</th> <th></th> </tr> </thead> <tbody> <tr ng-repeat="item in addressBook"> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.address}}</td> <td>{{item.postal_code}}</td> <td>{{item.id}}</td> <td> <button ng-show="item.isEditing != true" type="button" class="btn btn-primary btn-sm" ng-click="edit(item)"> <span class="glyphicon glyphicon-pencil"></span> </button> <button ng-show="item.isEditing === true" type="button" class="btn btn-success btn-sm" ng-click="submit(edit)"> <span class="glyphicon glyphicon-ok"></span> </button> <button ng-show="item.isEditing === true" type="button" class="btn btn-danger btn-sm" ng-click="cancelEdition(item)"> <span class="glyphicon glyphicon-remove"></span> </button> </td> </tr> </tbody> </table> </div> <script> function studentContoller($scope,$http){ $scope.edit = function(item){ item.isEditing = true; $scope.edit = JSON.parse(JSON.stringify(item)); // dirty deep copy } $scope.cancelEdition = function(item){ item.isEditing = false; } $scope.submit = function(item){ item.isEditing = false; } $scope.addressBook = [ {"id": 187, "name": "Le Goff Raymond SA", "address": "8, place Diallo","postal_code": "93 224","city": "Paul"}, {"id": 188,"name": "Gay","address": "2, rue de Deschamps","postal_code": "43092","city": "Pinto"}, {"id": 190,"name": "Le Guillet","address": "8, chemin Payet","postal_code": "59 633","city": "Leclercq"}, {"id": 191,"name": "Delorme SARL","address": "864, impasse Lesage","postal_code": "00 950","city": "Gaudin"}, {"id": 192,"name": "Normand SARL","address": "chemin de Lesage","postal_code": "90962","city": "Dufour-sur-Petitjean"}, {"id": 193,"name": "Lucas SARL","address": "21, boulevard Deschamps","postal_code": "84196","city": "Joubert-les"} ] } angular.module("MyApp",[]) .controller("studentContoller",studentContoller); </script> </body> </html>

所以我有兩個問題，我做錯了什么？ 以及如何調試它。

預先感謝，

Answer 1

您正在將JSON.parse結果設置為與該函數相同的名稱。 這就是為什么它第二次不起作用。 您必須使用其他名稱。

$scope.edit = function(item){
    item.isEditing = true;
    $scope.edit_test = JSON.parse(JSON.stringify(item)); // dirty deep copy
}

AngularJS編輯按鈕僅工作一次，然后出現TypeError：l不是函數

問題描述

1 個解決方案

解決方案1
3 已采納 2017-01-25 17:34:06

AngularJS編輯按鈕僅工作一次，然后出現TypeError：l不是函數

問題描述

1 個解決方案

解決方案1 3 已采納 2017-01-25 17:34:06

解決方案1
3 已采納 2017-01-25 17:34:06