Javascript 在中删除后刷新页面

我需要从材质表中删除一个用户，但页面不会刷新。 在我的控制台里没问题，但桌子里什么也没发生

如果我像在NgonInit中那样获取用户，它将重新加载整个表，而不是删除后的数据

ts文件

  deleteUser(user) {
    this.dataSource.data.splice(this.dataSource.data.indexOf(user), 1);
    console.log(user); // I have the good user
    console.log(this.dataSource.data); // my table is updated
  }

当我调用我的函数调用我的用户时

this.http.get("./assets/data/user.json")
      .subscribe(
        (response) => {
          this.dataSource.data = response;
          console.log(this.dataSource.data) // I have the inital table of users
        },

---

我建议创建一个用于保存数据的变量：

const data;
this.http.get("./assets/data/user.json")
    .subscribe(
        (response) => {
            this.data = response;
            this.dataSource.data = data;
            console.log(this.dataSource.data) // I have the inital table of users
        },

删除时：

deleteUser(user) {
   this.data.splice(this.data.indexOf(user), 1);
   this.dataSource.next(this.data);
   console.log(user); // I have the good user
   console.log(this.dataSource.data); // my table is updated
}

行

this.dataSource.next（this.data）通知数据已更改，然后反映更改

未测试，但如果有效，请尝试：

mat表
不会检测到数据源中的更改

如果它是通过变异而更改的，则仅当数组引用更改时才会重新呈现。使用下面的

splice

功能后，尝试不可变地更新

数据源中的
数据

this.dataSource.data.splice（this.dataSource.data.indexOf（user），1）；
this.dataSource.data=[…this.dataSource.data]；

或者，如果您有一个唯一的值，例如
user
中的
id
，则可以使用，因为它创建了一个新数组

deleteUser（id）{
this.dataSource.data=this.dataSource.data.filter（user=>user.position！==id）；
}

其中
id
是要删除的
用户的
id
。
可以显示HTML吗？可以告诉我如何通过组件传递数据并刷新主表吗？如果是父子关系，可以使用
@Input
和
@Output
。请参见，以查看可以在组件之间交互的所有方式。如果仍然存在问题，请创建一个新问题，因为它与此问题无关。
deleteUser(user) {
  this.dataSource.data.splice(this.dataSource.data.indexOf(user), 1);
  this.dataSource.next(this.dataSource.data);
}