Javascript AngularJS复选框工作不正常

我正在为自己的学习目的创建一个简单的

angularJs

应用程序。我已经附上了下面的代码片段。我有两个

JSON

数据

一个表示杂货项目的集合，另一个表示用户选择的项目。如果所选数据与收集数据的数据匹配，我将复选框标记为选中。我可以在单击复选框时插入数据，但如果我随机开始取消选中，则它无法正常工作。如果你能帮我纠正我犯的错误，我将不胜感激。另外，如果有比较

JSON

数据的简单方法，我将不胜感激。在这里，我使用

name

进行比较。有没有其他简单的方法来比较

JSON

中的单个对象，而不提及

name

或

type

，就像我在示例中在

angularJs

或

Javascript

中所做的那样

（函数（）{
角度。模块（“groceryApp”，[]）。控制器（“groceryController”，groceryController功能）；
GroceryController函数。$inject=[“$scope”、“$filter”]；
函数GroceryController函数（$scope，$filter）{
$scope.groceryCollection=groceryCollection\u JSON；
$scope.selectedItems=selectedItems\u JSON；
$scope.toggleSelection=函数（项）{
var isRemoved=false；
如果（$scope.selectedItems.length>0）{
对于（变量i=0；i<$scope.selectedItems.length；i++）{
if（$scope.selectedItems[i].name.indexOf（item.name）>-1）{
$scope.selectedItems.splice（$scope.selectedItems.indexOf（项目），1）；
isRemoved=true；
打破
}
console.log（“Checking…”+$scope.selectedItems[i].name.indexOf（item.name））；
}
}
//否则{
如果（！isRemoved）{
$scope.selectedItems.push（项目）；
}
//   }
console.log（$scope.selectedItems）
}
$scope.addCustomItem=函数（）{}
}
var groceryCollection_JSON=[{
“名称”：“西红柿”，
“类型”：“罗姆人”
}, {
“名称”：“花椰菜”，
“类型”：“有机”
}, {
“名称”：“苹果”，
“类型”：“Gala”
}, {
“名称”：“橙色”，
“类型”：“甜而不酸”
}, {
“名称”：“葡萄”，
“类型”：“野生”
}];
var selectedItems_JSON=[{
“名称”：“西红柿”，
“类型”：“罗姆人”
}];
})();

一个简单的AngularJs应用程序
欢迎来到我的杂货店
从下面的选项中选择您的项目

{{item.name}

其他

如果您的项目未显示在上面的列表中，请输入：







您选择的项目：

名称
类型
{{selection.name}
{{selection.type}
您只需在groceryCollection内的项目上使用selected标志即可

这将去掉
切换选择
，即减少到
ng click=“item.selected=！item.selected”

选中的ng只是
项。已选中

所选项目仅被过滤为
ng repeat=“groceryCollection中的选择|过滤器：{selected:true}”

您所做的一切就是在这个选择过程中，我们只标记选定的项目


（函数（）{
角度。模块（“groceryApp”，[]）。控制器（“groceryController”，groceryController功能）；
GroceryController函数。$inject=[“$scope”、“$filter”]；
函数GroceryController函数（$scope，$filter）{
$scope.groceryCollection=groceryCollection；
$scope.addCustomItem=函数（）{}
}
var groceryCollection=[{
“名称”：“西红柿”，
“类型”：“罗姆人”
}, {
“名称”：“花椰菜”，
“类型”：“有机”
}, {
“名称”：“苹果”，
“类型”：“Gala”
}, {
“名称”：“橙色”，
“类型”：“甜而不酸”
}, {
“名称”：“葡萄”，
“类型”：“野生”
}];
})();

一个简单的AngularJs应用程序
欢迎来到我的杂货店
从下面的选项中选择您的项目

{{item.name}

其他

如果您的项目未显示在上面的列表中，请输入：







您选择的项目：

名称
类型
{{selection.name}
{{selection.type}