Question

我正在尝试从选择数组中删除与我的其他数组匹配的选项，这些选项都来自api并通过ngFor显示，我已经在尝试使用过滤器但没有成功，代码如下遵循：

  loadUnidadeUsuarios() {
    return this.restApi.getUnidadeUsuarios(this.id).subscribe((data: UnidadeUsuario) => {
      this.unidadeUsuarioData = data;
    });
  }

然后在加载UnidadeUsuarioData之后，我需要删除匹配的用户：

 loadUsuarios() {
    return this.restApi.getUsuarios().subscribe((data: Usuario) => {
    this.Usuario = data;

    this.Usuario = this.Usuario.filter(usuario => usuario.id !== this.unidadeUsuarioData.id )
    });
 }

但没有成功

Answer 1

看起来像过滤器

this.Usuario.filter(usuario=>!this.unidadeUsuario.find(x=>x.id==usuario.id)

但是如果您需要等待两个通话结束，则必须考虑在内。为此，请使用switchMap

this.restApi.getUnidadeUsuarios(this.id).pipe(
  switchMap((res: any[]) => {
    //..here you has your getUnidadeUsuario...
    //but you want the others usuarios
    return this.restApi.getUsuarios().pipe(map((usuarios: any[]) => {
      //in usuarios you has all the usuarios
      //but you want filtered
      return usuarios.filter(u => !res.find(x => x.id == u.id))
    }))
  })
).subscribe(usuarios => {
  console.log(usuarios)
})

Answer 2

要获得预期的结果，只需两个循环，请使用以下选项

将unidadeUsuarioData转换为具有ID值的obj
过滤Usuario以检查unidadeUsuarioData是否具有属性ID

loadUsuarios() { let unidadeUsuarioDataObj = this.unidadeUsuarioData.reduce((acc, v) => { acc[v.id] = v; return acc }, {}) this.Usuario = this.Usuario.filter(usuario => !unidadeUsuarioDataObj[usuario.id]) console.log(this.Usuario) }

stackblitz供参考-https://stackblitz.com/edit/angular-dapycb?file=src/app/app.component.html

我正在寻找一种基于其他数组的值从我的选择数组中删除项目的方法

2 个答案: