angular.js:TypeError:v2.endpointsSelected不是函数

时间:2016-11-01 13:27:59

标签: angularjs

我有一个复选框,在每个复选框选项上我需要调用一个函数。

HTML:

<thead md-head>
                <tr md-row>
                  <th md-column><span><input type="checkbox"  ng-model="selectedAll" ng-click="checkAll()"/>Select</span></th>
                  <th md-column><span>Endpoint Name</span></th>
                  <th md-column><span>Endpoint Aliase</span></th>
                  <th md-column><span>Endpoint Protocol</span></th>
                </tr>
              </thead>
              <tbody md-body>
                <tr md-row ng-click="" md-select-id="name" ng-repeat="endpoint in endpoints | startFrom:currentPage*pageSize | limitTo:pageSize | filter: search ">
                  <td md-cell><input type="checkbox" ng-model="endpoint.Selected" ng-click="endpointsSelected()"/></td>
                  <td md-cell>{{endpoint.partName}}</td>
                  <td md-cell>{{endpoint.partSignalId}}</td>
                  <td md-cell>{{endpoint.partSignalType}}</td>
                </tr>
             </tbody>

JS:

$scope.endpointsSelected = function() {

            angular.forEach($scope.endpoints, function(endpoint){
                  if(endpoint.Selected){
                    alert(endpoint.partName);
                    $scope.endpointsSelected = [];
                    $scope.epName = endpoint.partName;
                    $scope.epId = endpoint.partSignalId;
                    $scope.epType = endpoint.partSignalType;

                    $scope.endpointsSelected.push({'partName': endpoint.partName, 'partSignalType': endpoint.partSignalType, 'partSignalId': endpoint.partSignalId});
                  }
                })

          }    

当我第二次选中复选框时,..我收到错误消息,说v2.endpointsSelected不是函数...

1 个答案:

答案 0 :(得分:3)

工作演示

var app = angular.module('app',[]);
app.controller('Ctrl',function($scope,$filter){
  
  $scope.data = {employee:[
    
    {'no':1,'name':'max','status':'bad'},
    {'no':2,'name':'fox','status':'good'},
    {'no':3,'name':'juno','status':'bad'},
    {'no':4,'name':'pet','status':'fair'},
    {'no':5,'name':'xyz','status':'good'},
    {'no':6,'name':'shit','status':'bad'},
    {'no':7,'name':'doggy','status':'fair'},
    {'no':8,'name':'hmmm','status':'bad'} 
  ]}
  
  $scope.selected=[];
  $scope.select = function(item){
    
    if(item.sel){
       $scope.selected.push(item.no);
      }else{
        var index = $scope.selected.indexOf(item.no);
        $scope.selected.splice(index,1);
        }
    };

   
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="Ctrl">
  <div ng-repeat="x in data.employee">
    <input type="checkbox" ng-model="x.sel" ng-change="select(x)" ng-click="x.sel"/> {{x.name}}
    </div>
  
  array - {{selected}}
  </div>

问题在于你的功能代码,你已经为范围变量分配了一个函数,如$scope.endpointsSelected = function() {};。现在在$scope $scope.endpointsSelected中有一个函数对象。

但请看看你的功能,

$scope.endpointsSelected = function() {

        angular.forEach($scope.endpoints, function(endpoint){
              if(endpoint.Selected){
                alert(endpoint.partName);
                $scope.endpointsSelected = [];// this line is the problem..you are again assigning  the $scope.endpointsSelected to [] (array)
                $scope.epName = endpoint.partName;
                $scope.epId = endpoint.partSignalId;
                $scope.epType = endpoint.partSignalType;

                $scope.endpointsSelected.push({'partName': endpoint.partName, 'partSignalType': endpoint.partSignalType, 'partSignalId': endpoint.partSignalId});
              }
            })

      } 

您再次将$ scope.endpointsSelected分配给[](数组),这不是一个函数。

解决方案

您可以更改您的函数名称或更改您在函数内创建的数组的名称。