从下拉列表中过滤重复的值

问题描述

  relatedToolsColumns: ColumnDef[] = [
  { field: 'toolId',name: 'Tool Number',type: 'dropdown',optionsList: this.tools,optionsListField: 'id',optionsListName: 'toolNo',width: '70%' },{
     field: 'delete',name: 'Delete',type: 'icon-button',width: '30%',sortingdisabled: true,icon: 'delete',callback: this.deleteRelatedTool.bind(this)
  }];

我正在使用端点调用“ getGageNoList”订阅这些工具：

 ngOnInit() {
  this.tool = this.data.tool;
  this.readonly = this.data.readonly;

 
  this.tprecmApiService.getGageNoList()
     .subscribe((val) => {
        this.tools = val;
        this.relatedToolsColumns
           .find((column: ColumnDef) => column.field === 'toolId')
           .optionsList = this.tools;
     });
  }

这是我拥有的工具： tool Array

这是我在“工具”界面中所拥有的，目前从下拉列表中选择了两个相同的工具编号。 The UI Add tool Display

工具的下拉列表： The dropdown list of tools in the grid

我需要将这些下拉列表过滤为仅尚未显示在网格上的下拉列表。

解决方法

this.tools.filter((tool,index,arr) => arr.findIndex(t => t.toolNo === tool.toolNo) === index)

将为您提供一个数组，其中具有与之相同的工具编号的工具将被过滤掉，因为findIndex返回与该函数匹配的第一项。

使用一些小型js可以对其进行过滤

if (!(dropdownTool in toolsArray)) { ... } // push to array you send to HTTML to loop in

angular javascript