0

使用“$scope”语法时，检查单个复选框会正确输出其对应的对象名称，但是当将“ControllerAs”语法应用于相同代码时，检查单个复选框会异常生成错误

$scope.users = [{.....}] //using $scope syntax
$scope.selected = [];

$scope.exist = function(item) {
  return $scope.selected.indexOf(item) > -1;
}
$scope.toggleSelection = function(item) {
  var idx = $scope.selected.indexOf(item);
  if (idx > -1) {
    $scope.selected.splice(idx, 1);
  } else {
    $scope.selected.push(item);
  }
}

在 ControllerAs 中使用上述代码的表示

vm.users = [{....}] //Using 'Controller As' Syntax
vm.selected = [];

vm.exist = function(item) {
  return vm.selected.indexOf(item) > -1;
}
vm.toggleSelection = function(item) {
  var idx = vm.selected.indexOf(item);
  if (idx > -1) {
    vm.selected.splice(idx, 1);
  } else {
    vm.selected.push(item);
  }
}

chrome 开发者工具返回错误

TypeError: vm.selected.indexOf 不是 GridController.vm.exist (gridController.js:37) 的函数

演示控制器作为，http ://plnkr.co/edit/5auLDGbpyDFUcpPxBzNs?p=preview

演示 $Scope，http ://plnkr.co/edit/2jz0ieeCWJE6tvzXK69A?p=preview

请问在这种情况下应用Controller As语法时可能是什么问题或可能是一个错误，谢谢

4

2 回答 2

0

在您的 plunkr 中，您将其绑定vm.selected到一个复选框；这告诉 angular 将其设置为布尔值。当您尝试调用.indexOf它时，它会失败，因为默认情况下带有 ng-model 的复选框是trueor false。

见这里：https ://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D

于 2017-03-27T02:07:32.963 回答
0

由于JavaScript Prototype Inheritance如何与原语一起使用，您的函数与toggleSelection. 这是不使用in 绑定导致意外结果的主要示例。ng-modelng-modelselected user$scope vm.selected.

在ng-model这种情况下，vm.selected从数组变为布尔值，这会级联到exist函数中的错误，现在看到一个没有.indexOf属性的布尔值。

在这种情况下，您的toggleSelection代码正在执行其余代码逻辑所需的操作，而您实际上并不需要ng-model.

于 2017-03-27T02:09:20.350 回答