Angular 以角度将对象推送到表格组件的步骤

场景：我有两个名为

客户

和

工作人员

的api，我在名为

客户

的组件中使用表显示所有

客户

及其

分配的工作人员

，如下图所示：

当我单击特定客户的编辑按钮时，我正在将该特定客户对象（前客户1）的值注入另一个名为编辑（对话框组件）的组件，在该组件中，我显示注入的

客户

属性

（名称、电子邮件）

和

分配的员工属性（姓名、电子邮件、电话）

放入表中。如下图所示：

如第二幅图所示，我在编辑组件中放置了另一个组件（工人列表），该组件将在下拉列表中显示所有工人：

预期结果：

• 现在我希望将

  工作人员列表

  组件中选定的工作人员推送到

  编辑

  组件中的表中，如下所示：

示例：

Worker 2

从

下拉列表中选择，并通过单击
Add
按钮添加到
edit
组件中的表中


它不应该添加重复项

我正在
编辑
组件中接收
已发出的工作人员
，但我无法验证重复项，也无法
将新工作人员推送到
表

由于组件很多，我正在给stackblitz发邮件，请看一看。
要重新渲染表，您需要创建一个新数组，如下所示：

this.customerWorkers = [...this.customerWorkers, ...value];

若要跳过空值（而不是将其添加到表中），可以对主题使用筛选器，如：

this.dataService.onSelectWokers.pipe(
     filter(x => x)
   )

此外，您还需要在将工作人员推送到服务之前对其进行映射，例如：

const workersMap = this.addForm.value.workerIds;
const workersArray = Object.keys(workersMap).map(x => workersMap[x]);

希望对您有所帮助。
您想将辅助对象推入编辑表还是主表？在希望推入编辑表中。@Shankar如果问题仍然存在，请检查此问题：现在我没有面临任何重复问题，但在删除特定辅助对象后，我面临重复问题我将提供更新的链接。。很快，我带着另一个需求离开了，现在重复添加了如何避免它。？，使用id唯一性过滤器。没问题，我很高兴它有帮助。