Question

我有一个编辑弹出窗口，当弹出窗口打开并编辑时，它会反映在桌面上。我必须避免反射，一旦我点击保存按钮，那么只有编辑的部分必须显示在表格上。我只能为一个输入做这个，我不知道如何对其他2个输入执行相同的方式。

// TS

isCheckedAndDisabled(i: number) {
  return this.rated_data[i]!== undefined && 
  this.rated_data[i].spr_psf_master_id !== undefined &&
  this.rated_data[i].spr_psf_master_id == data.psf_master_id &&
  5 == this.rated_data[i].spr_review;
}


<input type = "radio" value = "5" [checked]="isCheckedAndDisabled(i)" [disabled]="isCheckedAndDisabled(i)" formControlName = "{{data.psf_master_id}}" ngModel required>

Answer 1

组件上必须有两个不同的属性，引用两个不同的对象实例。几件事情要做：

步骤1：单击“编辑”，复制表格行（所有道具）并将它们放入模态中。保持对的引用，例如您要编辑的表格行，或_id或其他内容。

在您的情况下，将属性添加到名为currentlyEditing: any的TutorialComponent。然后，修改editTutorial方法：

editTutorial(tutorial) {
  this.editTutorials.show();
  this.currentlyEditting = tutorial;
}

第2步：编辑那些不应该反映在表格上。继续编辑你的东西。

步骤3：保存后，将更改同步回表格，或者更确切地说，同步到表格中显示的原始数据集。这就是您需要步骤1中的参考的原因。

现在，我不清楚您的edit_tut组件是否是保存更改的组件。但如果是的话，我认为一切都会按原样运作。如果没有，您必须在保存并回复“成功”后，在tutorials数组中找到原始教程，并将其替换为已编辑的组件。

Answer 2

您将从表格发送的tutorial值分配到edit_tut varable，其作用为two-way binding。

因此，表格中的数据会随着您的输入而变化。

解决方案可以更改variable reference，您可以执行类似的操作，

editTutorial(tutorial) {
 this.editTutorials.show();
 let tut = JSON.parse(JSON.stringify(tutorial))
 this.edit_tut = tut;
}

这将更改 value reference ，并将为您效劳。

在使用Angular2保存之前，如何避免将弹出窗口中输入的数据反映到表中

2 个答案: