Angularjs - 无法从子级更新模型

时间:2014-09-16 20:04:17

标签: javascript angularjs

如果获得了表单的动态ng-repeat,则需要一个按钮来向lis添加新项目,一个按钮用于删除项目,一个按钮用于保存所有项目。我可以添加新项目并将其删除。在保存按钮上,我将模型“somedata”传递给save方法。但在“somedata”对象中,它仍然包含已删除的项目?我忘记了什么吗?

提前致谢

<ul>
  <li ng-repeat="item in items track by $index">
     <input ng-model="somedata[foo][$index]">
     <input ng-model="somedata[bar][$index]">
     <button ng-click="removeItem($index)">remove</button>
  </li>
</ul>

<button ng-click="addItem()">add</button>
<button ng-click="saveInputs(somedata)">remove</button>

****

$scope.removeItem = function(id) {
   $scope.items.splice(id, 1);
}

$scope.saveInput = function(input) {
   console.log(input) # -> contains also deleted data???
}

*解决方案* 我还需要从模型中删除该项

$scope.removeItem = function(id) {
   $scope.items.splice(id, 1);
   $scope.somedata.splice(id, 1);
};

1 个答案:

答案 0 :(得分:0)

我很抱歉由于我缺乏50个声誉而无法要求澄清,所以如果这个答案粗制滥造,那么我会请求你的原谅。

您似乎想知道为什么使用按钮删除项目并不会删除您在控制台中打印的元素。这样做的原因是,当您从商品列表中删除时,实际上从未触及somedata对象。

我附上了我对你的问题的理解。

http://plnkr.co/edit/L0EZd6IBttnTkKWepDiK?p=preview

$scope.removeItem = function(id) {
    $scope.items.splice(id, 1);
};

概述的代码段管理项目集合,但不会映射(至少从我在此处收集的内容)到您的somedata集合。

我建议用这个来解决这个问题或者这个问题:

$scope.removeItem = function(id) {
   $scope.items.splice(id, 1);
   $scope.somedata.splice(id, 1);
};