ng-model用于动态加载的项目。

19 浏览
0 Comments

ng-model用于动态加载的项目。

我有一个列表，其中包含一些动态项目（例如汽车），因此其长度不固定。当我加载此列表时，它看起来像这样：

itemList = [
    { id: 0, name: 'bmw' },
    { id: 1, name: 'audi' },
    { id: 3, name: 'vw' },
    { id: 4, name: 'subaru' },
    { id: 5, name: 'mercedes' }
];

之后，我在ng-repeat循环中循环此列表并创建一些复选框，以便我可以选择项目：

现在我有一个用户对象。此对象内有一个名为“cars”的数组，在其中我想添加所有选定的汽车并在取消选择时删除它。我的对象看起来像这样：

userObj = [
    { 
      name: 'user1', 
      cars: [] 
    }
];

因此，当我选择汽车时，它应该被推入用户对象中的数组cars中，并在取消选择时删除。我知道我必须使用ng-change来完成这个任务，这对我来说不是真正的问题。我的问题是复选框的ng-model。我不知道最好的做法。我不能为每个列表使用相同的ng-model，这是非常合乎逻辑的。什么是最好的方式？在互联网上没有找到解决方案。

admin 更改状态以发布 2023年5月20日
0

1 答案

0 Comments

您可以在每个项 itemList 的 checkbox 的 change 上，更新特定用户的 cars 数组，就像下面这样。

Markup

Code

$scope.itemChange = function(user){
   var selectedCarsIds = $scope.itemList.filter((i) => i.checked).map(item => item.id)
   //update cars array for specific user
   user.cars = selectedCarsIds;
}

0