Ng-repeat 一个带有 json Angular 的函数

Question

我是 Angular 的新手。我正在尝试做一个应用程序。在我做之前

this（注意第二个Fork，在中间，不是最后一个）

有两个选择：第二个是空的，并使用第一个选择中选择的选项的子数组自动完成。这行得通。

现在，这是我正在做的一张桌子。事实上，这些行包含上面的两个选择。我还将添加一个添加新行的按钮，因此使用新的选择。我尝试过迭代，但当然它不起作用....在此更新THIS 中，您可以在 script.js 中看到我添加了新代码（我制作了 cmets）。我创建了一个数组来包含所有信息，一个添加新行的函数和一个删除行的函数。但当然它不起作用.......我做错了什么？

特别是新的js代码行：

 $scope.allInfo = [
  {
     "Product ID" : $scope.selectedProduct.id,
     "Product Nome" : $scope.selectedProduct.nome,
     "Product Codice": $scope.selectedProduct.codice,
     "Lot ID" : $scope.selectedLot.id,
     "Lot Value" : $scope.selectedLot.value
  }   
 ];

$scope.foods = [
 {
  "select1": "",
  "select2": ""
 }
]


$scope.newLine = function () {
  var itemToAdd = { "select1": "", "select2": ""};
 $scope.allInfo.push(itemToAdd);
}

$scope.removeLine = function (itemIndex) {
  $scope.foods.splice(itemIndex, 1);
 }

Answer 1

首先，在 newLine 方法中，您需要读取 $scope.selectedProduct 和 $scope.selectedLot 并使用它来创建一个新项目，您将推送到 $scope.allInfo 数组。

 $scope.newLine = function () {

    var itemToAdd = { "select1": $scope.selectedProduct.descrizione,
                      "select2": $scope.selectedLot.value};
    $scope.allInfo.push(itemToAdd);
}

现在在您的 UI 中，您可以使用 ng-repeat 显示 $scope.allInfo 中的项目

<h1>INFO ABOUT SELECTION</h1>

<div ng-repeat="item in allInfo">
  {{item.select1}} - {{item.select2}}
</div>

Here 是一个工作示例。