Question

我有一个角度为2的表单，带有双向绑定数据值（[（ngModel）]），用于编辑和添加功能。

用户点击列表页面中的编辑并更改输入中的值，同时编辑更改的（新）值也会显示在列表页面中，而不是保存点击取消按钮。需要在列表页面中显示旧值。

project-form.component.html
---------------------------
   <input class="form-control"  type="text" size="30" pInputText [(ngModel)]="project.title" name="title" pTooltip="Enter your username"/>

    <ul class="list-group">
          <li *ngFor="let event of project" class="list-group-item">
            <span class="event_release">{{event.startDate | date: 'dd/MM/yyyy'}} </span><br />
            <strong>{{event.title}}</strong>
          </li>
        </ul>

Project-form.component.ts 
-------------------------
@Input() project: Project;

提交发送变量（this.project）时保存更新值（牵引路绑定变量），如果用户单击取消按钮（this.project），则需要回滚。

Answer 1

只需创建project对象的深层副本即可。您面临的问题是由于列表页面和编辑页面正在处理对象的同一副本，因此在一个地方更改对象也会反映在其他地方。

使用此javascript代码（在编辑页面中执行此操作）

let project_copy =JSON.parse(JSON.stringify(project))

然后在编辑中而不是使用此project_copy

处理项目变量

如何在angular2中回滚ngModel双向绑定数据

1 个答案:

使用此javascript代码（在编辑页面中执行此操作）