Question

我有一个html表

<table>
  <tr ng-repeat="row in rowsproductrequests">
    <td>{{row.PRODUCTID}}</td>
    <td>{{row.DESCRIPTION}}</td>
  </tr>
</table>

搜索产品的第二个表：

<table>
  <tr ng-repeat="row in searchproductsList">
    <td>{{row.PRODUCTID}}</td>
    <td>{{row.DESCRIPTION}}</td>
  </tr>
</table>

单击时，我将项目从搜索表（第二个表）推送到主表（第一个表）： JS：

$scope.addItemAsIng = function(row){
  $scope.rowsproductrequests.push(row);
}

推送项目。我的问题是如何检查第一个表中是否存在某个项目，这样我就可以停止两次推送同一个项目。

Answer 1

使用includes，例如：

$scope.addItemAsIng = function(row){
  if(!$scope.rowsproductrequests.includes(row)) $scope.rowsproductrequests.push(row);
}

Answer 2

另一种方法

我建议不要通过将所选项目推送到第二个数组来填充第二个表格，而是建议使用相同的数组，但通过自定义过滤器发送，以识别选择的项目。

怎么做

1）在控制器中创建一个函数，将给定对象的selected属性设置为true：

$scope.onAvailableRowClicked = function(row){
  row.selected = true;
}

2）然后使用ng-click指令将其连接到第一个表（可用对象）：

<h4>Available</h4>
<table>
  <tr ng-repeat="row in rowsproductrequests"
    ng-click="onAvailableRowClicked(row)"> 
    <td>{{row.PRODUCTID}}</td> 
    <td>{{row.DESCRIPTION}}</td>
  </tr>
</table>

3）现在创建一个自定义过滤器，标识给定数组中selected属性设置为true的所有对象：

app.filter("isSelectedFilter", function() {
  return function(input){
    return input.filter(function(obj){
      return (obj.selected === true);
    });
  } 
});

4）最后，使用第二个表的ng-repeat中的过滤器来识别所选记录：

<h4>Selected</h4>
<table>
  <tr ng-repeat="row in rowsproductrequests | isSelectedFilter"> 
    <td>{{row.PRODUCTID}}</td> 
    <td>{{row.DESCRIPTION}}</td>
  </tr>
</table>

此方法的好处

您只需维护一个数组。较少的变量意味着您的代码变得更容易阅读，您可以更轻松地看到驱动视图的内容。如果出现问题，它也更容易调试。
每个对象只有一个实例。事实的一个来源意味着物体不会失去同步的危险（＆＃34;我应该使用这个还是那个！？！？＆＃34; ）。这也意味着在物理上不可能多次选择一个对象。
您可以轻松地在视图的其他部分重复使用selected属性。如果要在可用列表中突出显示已选择哪些对象，则可以使用ng-class轻松完成。（在这里使用数组比较逻辑的想法已经让我头疼了！）

演示

CodePen: A custom filter to identify selected records

Answer 3

方法一：一个解决方案是从第二个表中添加行，从集合中删除该项，并添加到第一个表，即如何永远不会获得重复项。第二种方法：在添加此项是否存在之前，您必须根据需要检查的这些标识列在两个表中维护标识列。

Answer 4

你也可以使用“indexOf（）”，它会返回你当前项目的数组索引，如果不退出就会返回-1

像

if($scope.rowsproductrequests.indexOf(row) != -1)

在将其推送到表之前检查是否已存在行

4 个答案: