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

Question

我有一个复选框，每个复选框选择我需要调用一个函数。

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不是一个函数...

Answer 1

工作演示

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分配给像$scope.endpointsSelected = function() {};。现在范围变量的函数$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为[]（数组），这是不是一个函数。

解决方案

要么你可以改变你的函数名称或更改所创建的函数内部数组的名称。