在两个不同的数组中推送相同的数据时，在对象数组中创建重复条目
在两个不同的数组中推送相同的数据时，在对象数组中创建重复条目
提问于 2019-05-29 00:51:51
我遇到了一个奇怪的问题，所有这些都是因为allIpRecords: any;，其中我想要维护ipRecords: any;的副本，因为在原始代码中，ipRecords可能会更改，而我想在allIpRecords中保留以前的副本，问题是每当insert函数运行时，如果我在insert函数中有this.allIpRecords = res.data;，那么在数组ipRecords和this.allIpRecords中都会创建插入行的重复条目，并且在表中显示相同的行两次。如果删除this.allIpRecords，则不会发生这种情况，只有一项插入项在数组中。即使在数据库中它只插入一次，但在本地数组中它会显示两次。
<td>
<span></span>
</td>
<td>
<input type="text" [(ngModel)]="newData.ip" />
</td>
<td>
<input type="text" [(ngModel)]="newData.forDomain" />
</td>
<td>
<input type="text" [(ngModel)]="newData.status" />
</td>
<td>
<input type="text" [(ngModel)]="newData.senderEmail" />
</td>
<td>
<button class="common-btn" type="button" (click)="insert()">Insert</button>
</td>
</tr>
<tr *ngFor="let record of ipRecords" class="colour02">
<td>{{record.id}}</td>
<td *ngIf="record.id === editRowId"><input type="text" [(ngModel)]="record.ip" ></td>
<td *ngIf="record.id !== editRowId">{{record.ip}}</td>
<td *ngIf="record.id === editRowId"><input type="text" [(ngModel)]="record.forDomain" ></td>
<td *ngIf="record.id !== editRowId">{{record.forDomain}}</td>
<td *ngIf="record.id === editRowId"><input type="text" [(ngModel)]="record.status" ></td>
<td *ngIf="record.id !== editRowId">{{record.status}}</td>
<td *ngIf="record.id === editRowId"><input type="text" [(ngModel)]="record.senderEmail" ></td>
<td *ngIf="record.id !== editRowId">{{record.senderEmail}}</td>
<td>
<br>Ts
private newData: any = {};
ipRecords: any;
allIpRecords: any;
ngOnInit() {
this.auth.getAllIpRecords().subscribe((res: any)=>{
this.ipRecords = res.data;
this.allIpRecords = res.data;
}
}
insert() {
if(Object.keys(this.newData).length === 0) {
this.toastr.error("Empty record");
return;
}
this.auth.addIpRecord(this.newData).subscribe((res: any)=>{
if(res.status === "Success") {
this.newData = {};
this.ipRecords.push(res.data);
this.allIpRecords.push(res.data);
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2019-05-29 03:31:28
在这两个变量上，都传递了相同的对象引用-
this.ipRecords = res.data;
this.allIpRecords = res.data;因此，修改任何一个变量都会更改所有变量，因为它们是相同的引用。
要解决此问题，请克隆res.data，然后将其赋给变量。有一个简单的技巧可以通过使用JSON.stringify()和JSON.parse()来实现这一点
this.ipRecords = JSON.parse(JSON.stringify(res.data));
this.allIpRecords = JSON.parse(JSON.stringify(res.data));您可以找到有关对象克隆HERE的更多详细信息
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56346868
复制相关文章
相似问题