关于angular：克隆对象类型脚本


Cloning objects TypeScript

本问题已经有最佳答案，请猛点这里访问。

我在用2号字体。我有用户管理组件，其中有整个用户的表。

当单击表中的任何用户时，将用其所有属性组成appaer进行编辑。选择用户发生事件如下：

1
2
3
4
 onUserSelected(event) {
        var selectedId = event.data.id;
        this.selectedUser = this.users.filter(user => user.id === selectedId)[0]
    }

问题是，当SelectedUser被编辑时，其属性也会在表中发生更改，并且看起来不太好。我试图创建副本如下，但没有帮助-用户类

1
2
3
4
 clone() {
        var cloned = new User(this.id, this.login, this.name, this.surname, this.phone);
        return cloned;
    }

也许我在做一件在安古拉不是很好的练习？

相关讨论

试用使用

1
this.user = Object.assign({}, currentObject);

正如@angularfrance所提到的，这只适用于浅层复制对象，如果需要深度复制对象，请寻求其他实现。

相关讨论

您可以使用木屑：

https://lodash.com/docs_clonedeep

对于许多对象/阵列操作，建议使用lodash

相关讨论

您可以将编辑器表单绑定到一个空的用户对象，例如editUser，而不是selectedUser变量(它指向用户集合的一个元素)。在您的onUserSelected(event)中，您可以通过克隆所选用户对象的可变属性来初始化editUser。提交编辑表单((ngSubmit)="editSubmit()"时，将替换用户集合中所选用户对象中的原始属性。

沿着这条线的东西：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
editUser: User = new User();
selectedId: number;
selectedUser: User;

onUserSelected(event) {
    this.selectedId = event.data.id;
    this.selectedUser = this.users.filter(user => user.id === this.selectedId)[0];
    this.editUser = this.simpleClone(this.selectedUser);
}

editSubmit(event) {
    this.selectedUser = this.simpleClone(this.editUser);
}

simpleClone(obj: any) {
    return Object.assign({}, obj);
}

simpleclone实现不适合进行深度克隆，因此如果用户对象包含对其他对象的引用，那么应该将其转换为适当的克隆功能。