Question

你好：我在AngularJS中弄湿了脚。我正在尝试添加和删除数组中的元素;但是，我无法达到预期的效果。

foll是JSON结构：

    $scope.masters = [
    {
"name": "Wittgenstein",
"thoughts": ["thought 1", "thought 2", "thought 3"]

},

{
"name": "King",
"thoughts": ["thought 1", "thought 2", "thought 3"]

}
  ];

foll是the plunker。

Plunker

非常感谢任何输入。谢谢。

Answer 1

正如@Mathew建议的那样，您应该按如下方式介绍$index的用法：

JS代码：

$scope.input = [];

$scope.add = function(i) { // receiving index as param
    $scope.masters[i].thoughts.push($scope.input[i]);
    $scope.input[i] = '';
};

HTML code：

<div ng-repeat="master in masters">
  <h1>{{ master.name }}</h1>
  <ul>
    <li ng-repeat="thought in master.thoughts">
      {{ thought }} <button ng-click="remove($index)">Remove</button>
    </li>
  </ul>
  <input type="text" ng-model="input[$index]">
  <button type="submit" ng-click="add($index)">Add</button>
</div>

请参阅 Plunker working example

Answer 2

您需要指定主人的索引。这样的东西应该在remove函数中起作用：

$scope.masters[masterIndex].thoughts.splice(index, 1);

其中masterIndex是您要从

中删除思想的主索引

Answer 3

这是plnkr的更新版本。

from itertools import product

for a, b in product(list1, list2):
    if a + b == x:
        print a, b

注意我是如何将当前master作为参数包含在remove函数中的。这可确保拼接正确的master，因为JavaScript数组是通过引用传递的。下面是更新的角度控制器。

<!DOCTYPE html>
<html ng-app="app">
  <head>
    <script data-require="angular.js@1.4.0" data-semver="1.4.0" src="https://code.angularjs.org/1.4.0/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="demoController">

    <div ng-repeat="master in masters track by $index">
      <h1>{{ master.name }}</h1>
      <ul>
        <li ng-repeat="thought in master.thoughts track by $index">
          {{ thought }} <button ng-click="remove(master, $index)">Remove</button>
        </li>
      </ul>
      <input type="text" ng-model="input[$index]">
      <button type="submit" ng-click="add($index)">Add</button>
    </div>

  </body>
</html>

add函数似乎不是从输入模型中选择值，但那应该是一个绑定问题，而不是功能不正常。

Working Plunkr

我希望这会有所帮助。

Answer 4

问题是你需要传递给主人的索引添加和删除功能。因为你这样做：

$scope.masters.thoughts.splice(index, 1);

但是masters是一个Array，因此你需要在该Array中选择一个对象，例如

$scope.remove = function(masterIndex, thoughtsIndex) {
    $scope.masters[masterIndex].thoughts.splice(thoughtsIndex, 1);
};

要在HTML中使用此功能，您必须使用内部ng-repeat

中的父索引

<div ng-repeat="master in masters">
    <h1>{{ master.name }}</h1>
    <ul>
        <li ng-repeat="thought in master.thoughts">
            {{ thought }}
            <button ng-click="remove($patent.index, $index)">
                Remove
            </button>
        </li>
  </ul>
  <input type="text" ng-model="input">
  <button type="submit" ng-click="add($index)">Add</button>
</div>

在Add函数中，你必须做同样的事情才能重新获得master数组的$ index。

无法在AngularJS中添加或删除数组中的元素

4 个答案: