Javascript 在angular2/typescript中提交前限制双向绑定

我在弹出窗口中编辑表单字段。同时显示一个背景窗体。在这种形式下，我在editPop中键入的任何内容在提交之前都会以后台形式显示。如何在保存功能之前防止出现这种情况

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

我需要显示，只有在保存后，而不是在弹出窗口编辑

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

我想这是因为

c.cName

产生了双向绑定。我怎样才能克服这个问题

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

请帮忙。 我在这里分享我的HTML和TS代码

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

HTML代码

 <md-card class="col-lg-12 col-md-12 col-sm-12 col-xs-12" *ngFor="let c of cL ">
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
      {{c.cName}}
    </div>
    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2" style="text-align:right;padding-right: 0px;">
   <button class="iconBtn" (click)="openC(c)">
 <md-icon svgIcon="edit" style="color: rgba(0,0,0,0.54);height: 17px;width: 17px;"></md-icon></button>
   </div>
   </md-card>

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

---

而不是

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

---

希望这能奏效

除了上面的答案，你可以这样做

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

HTML格式的

<div class="modal-body row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                        <md-input-container style='width:100%'>
                            <input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>
                        </md-input-container>
                    </div>
  </div>

<div layout-align="end center" layout="row">
<button md-raised-button class="md-raised color-white" (click)="newC(c)" [disabled]="!cForm.form.valid" style="width: 46%;margin: 10px 5px;">Save</button>
                    </div>

<input type="text" name="cName" mdInput [(ngModel)]="c.cName" placeholder="c" required>

<md-input-container style='width:100%'>
   <input type="text" name="cName" 
    mdInput #updatedC [value]="c.cName"  placeholder="c" required>
 </md-input-container>

---

请用“它也正在接受div中的条目”来解释该部分。此div没有输入功能。您的意思是您仍然可以编辑弹出窗口下的其他输入吗？请查看问题已在弹出窗口中更新删除[（ngModel）]编辑并使用变量管理值。在提交时，使用该值更新模型。我对此不熟悉。如果我出错，请提供帮助。我将立即尝试。它正在工作，但在我更改值并单击“提交”后，其未使用编辑的值更新。抱歉，未获得保存。我收到此错误：“无法设置未定义的属性‘名称’”是。它位于同一html中