如何删除列表项angular??angular.js:12416语法错误:意外的令牌u

how to delete list item angular?? angular.js:12416 SyntaxError: Unexpected token u

本文关键字:angular 错误 语法 12416 意外 令牌 何删除 js 删除 列表      更新时间:2023-09-26

在控制台中,我有错误angular。js:12416 SyntaxError:意外的令牌u程序不起作用
我不知道该做什么。谢谢你的帮助!!我拥有的所有链接(bootstrap,angular,app.js,style.css)

在Object.parse(本机)
在m.$scope.retrieveCompanys/app.js:10:19)
at new(app.js:18:29)
在Object.e[as invoke]angularjs/1.4.5/angular.min.js:39:96)
在Q.instance/angularjs/1.4.5/angular.min.js:80:151)
在L angularjs/1.4.5/angular.min.js:61:140)
在g angularjs/1.4.5/angular.min.js:54:326)
在g angularjs/1.4.5/angular.min.js:54:349)
在angularjs/1.4.5/angular.min.js:53:388
在angularjs/1.4.5/angular.min.js:20:8

if (!localStorage.getItem("companys")) {
  localStorage.setItem("companys", JSON.stringify([]));
};
(function() {
  var app = angular.module('myApp', []);
  app.controller('ListController', function($scope){
    $scope.retrieveCompanys= function() {
      return JSON.parse(localStorage.getItem('companys'));
    }
    this.addToStorage = function(company){
      $scope.companys.push(company);
      localStorage.setItem('companys', JSON.stringify($scope.companys));
    }
    $scope.companys= $scope.retrieveCompanys();
     $scope.removeCompany = function (index) {
               $scope.companys.splice(index,1);
    };
    $scope.add = false;
    $scope.togglechild = function() {
      $scope.add = !$scope.add;
    };
  });
  app.controller('AddController', function(){
    $scope.company = {};
    $scope.addCompany = function(list) {
      list.addToStorage($scope.company);
      $scope.company = {};
    };
  });
})();
   
<!DOCTYPE html>
<html ng-app="myApp">
   <head>
      
   </head>
   <body  class="container" ng-controller="ListController as list">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" ng-controller = "AddController as addCtrl">
         <form name="addCompanyForm"  ng-submit="addCtrl.addCompany(list)" novalidate>
            <h3 class="text-center">Add new company</h3>
            <fieldset class="form-group">
               <input  class="form-control" ng-model="addCtrl.company.name_company" placeholder="Name Company" ng-required>
            </fieldset>
            <fieldset class="form-group">
               <div class="input-group">
                  <div class="input-group-addon">$</div>
                  <input  class="form-control" ng-model="addCtrl.company.annual_earnings"  placeholder="Annual earnings" ng-required>
               </div>
            </fieldset>
            <br>  
            <fieldset class="form-group">
               <input  type="submit" class="btn btn-primary pull-right"  ng-click="addCompany(list)" value="Add Company">
            </fieldset>
         </form>
         <form ng-show="add">
            <h3 class="text-center">Add child company</h3>
            <fieldset class="form-group">
               <input  class="form-control" ng-model="addCtrl.company.name_company" placeholder="Name Company" ng-required>
            </fieldset>
            <fieldset class="form-group">
               <div class="input-group">
                  <div class="input-group-addon">$</div>
                  <input  class="form-control" ng-model="addCtrl.company.annual_earnings" placeholder="Annual earnings" ng-required>
               </div>
            </fieldset>
            <br>  
            <fieldset class="form-group">
               <input  type="submit" class="btn btn-primary pull-right"  ng-click="addCompany(list)" value="Add Company">
            </fieldset>
         </form>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8" >
         <h3 class="text-center">List of Company</h3>
         <table class="table">
            <tr>
               <th class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></th>
               <th class="col-xs-5 col-sm-5 col-md-5 col-lg-5">Name Company</th>
               <th class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">Own earnings</th>
               <th class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">Total earnings</th>
               <th class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">Edit/Delete</th>
            </tr>
            <tr ng-repeat="company in list.companys  track by $index">
              <td class="col-xs-1 col-sm-1 col-md-1 col-lg-1 text-center">
                <a href="#{{'demo'+$index}}" data-toggle="collapse"><span class="glyphicon glyphicon-eye-open"></span></a>
              </td>
               <td class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center">
                  
                  <b ng-hide="editing" ng-click="editing = true">{{company.name_company}}</b>
                  <form ng-show="editing" ng-submit="editing = false">
                   <button class="btn" type="submit"><span class="glyphicon glyphicon-ok"></span></button>
                    <input type="text" ng-model="company.name_company" placeholder="Name" ng-required>
                   
                  </form>
               </td>
               <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">
                  <span  ng-hide="editing" ng-click="editing = true">{{company.annual_earnings + " $"}}</span>
                  <form ng-show="editing" ng-submit="editing = false">
                    <input type="text" ng-model="company.annual_earnings" placeholder="Annual earnings" ng-required>
                  </form>
               </td>
               <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">   
               </td>
               <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-center">
                  <a ng-click="editing = true" title="Edit Data"><span class="glyphicon glyphicon-edit"></span></a>&ensp;
                  <a ng-click="removeCompany(company)" title="Delete"><span class="glyphicon glyphicon-remove-sign"></span></a>&ensp;
                  <a ng-click="togglechild()" title="Add Child Company"><span class="glyphicon glyphicon-plus-sign"></span></a>
               </td>
            <tr id="{{'demo'+$index}}" class="collapse">
               <td>{{}}</td>
               <td>{{}}</td>
               <td>{{}}</td>
               <td>{{}}</td>
               <td>{{}}</td>
            </tr>
            </tr>          
         </table>
      </div>
 
       
   </body>
</html>

edit:您已经澄清了错误的来源:它抛出错误是因为您告诉Angular removeCompany函数在名为AddController的控制器中。它不是——你已经在ListController中定义了它。

如果您已经提供了应用程序的完整代码,那么问题似乎是您说div元素应该使用一个名为AddController的控制器,但您还没有定义具有该名称的控制器。你需要另一个控制器来处理这一部分吗?看起来您在视图中引用的所有内容——companysremoveCompany等——都包含在ListController中。尝试删除提及AddController的部分,并使div元素看起来像这样:

<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">