仅在提交时保存数据

Question

我处理让我疯狂的问题:(， 我有一个在AngularJS 2中编写的编辑用户页面表单， 页面显示用户的数据以及用户点击“编辑”的时间 我使用ngModel在输入中设置数据， 当用户更改输入数据时，它会在常规页面中更改它（即使他没有单击提交），这显然是正确的，这就是双向数据绑定的工作方式。 但是，只有当用户点击提交时，我才能这样做，而不是保存数据？ 我已经尝试使用[value]但它只显示并且在我向组件中的函数发送参数时不会更新，谢谢！

<!--main-->
<div class="main-container">


  <div class="wrapper">

  <div class="user-profile">
          <div class="title">
              {{title}}
          </div>

        <!--  change password  section -->
        <div *ngIf="action == 'password'">
            <label for="title">סיסמא ישנה</label>
            <input type="password" class="form-control" placeholder="הכנס את סיסמתך הישנה" [(ngModel)]="loggedInUser.oldPassword">

            <label for="title">סיסמא חדשה</label>
            <input type="password" class="form-control" placeholder="הכנס את סיסמתך החדשה" [(ngModel)]="loggedInUser.newPassword">

            <label for="title">סיסמא חדשה שנית</label>
            <input type="password"  class="form-control" placeholder="הכנס את סיסמתך החדשה שנית" [(ngModel)]="loggedInUser.newPasswordRepeat">

        </div>
        <!-- end -->

        <div class="form-group" *ngIf="!action">

              <label for="title">שם משתמש</label>

              <p *ngIf="!userInput">{{loggedInUser.username}} <a (click)="openUserInput()"><i class="fa fa-pencil" aria-hidden="true"></i></a></p>
              <div class="input-group" *ngIf="userInput">
              <input type="text" class="form-control"  [(ngModel)]="loggedInUser.username" style="float:right;">
              <button class="btn btn-default" style="float:left;" (click)="saveChanges(loggedInUser.username)">שמור</button>
              </div>

              <label for="title">סיסמא</label>
               <br />
              <p><a [routerLink]="['password']">שנה סיסמא <i class="fa fa-pencil" aria-hidden="true"></i></a></p>
        </div>



        <div class="form-group" *ngIf="!action">
            <label for="title">שם מלא</label>
            <p>{{loggedInUser.firstName + ' ' + loggedInUser.lastName}}</p>
        </div>

        <div class="form-group" *ngIf="action == 'edit'">
            <label for="title">שם פרטי</label>
            <input type="text" class="form-control" [(ngModel)]="loggedInUser.firstName" placeholder="שם פרטי">
        </div>

        <div class="form-group" *ngIf="action == 'edit'">
            <label for="title">שם משפחה</label>
            <input type="text" class="form-control" [(ngModel)]="loggedInUser.lastName" placeholder="שם משפחה">
        </div>

        <div class="form-group" *ngIf="!action || action =='edit'">
              <label for="title">תאריך לידה</label>
              <p *ngIf="!action">{{loggedInUser.birthDate | date:'dd/MM/y'}}</p>
            <div *ngIf="action == 'edit'">
              <input type="date" [(ngModel)]="loggedInUser.birthDate" value="{{loggedInUser.birthDate | date:'dd/MM/y'}}" class="form-control">
            </div>
        </div>

        <div class="form-group" *ngIf="!action || action =='edit'">
              <label for="title">אימייל</label>
              <p *ngIf="!action">{{loggedInUser.email}}</p>
              <div *ngIf="action == 'edit'">
              <input type="email" [(ngModel)]="loggedInUser.email" class="form-control">
            </div>
        </div>
    <div *ngIf="action == 'edit'">
      <button class="btn btn-primary button" (click)="saveChanges()">ערוך פרטים אישיים</button>
      <button class="btn btn-default button" [routerLink]="['..']">חזור אחורה</button>
    </div>
    <div *ngIf="action == 'password'">
      <br />
      <button class="btn btn-primary button" (click)="savePassword()">שמור סיסמא חדשה</button>
      <button class="btn btn-default button" [routerLink]="['..']">חזור אחורה</button>
    </div>
    <div *ngIf="!action">
      <button class="btn btn-primary button" [routerLink]="['edit']">עדכן פרטים אישיים</button>
    </div>

  </div>

    <div class="left-side">
      <img src="https://scontent-lht6-1.xx.fbcdn.net/v/t1.0-9/13620270_1084305151608899_3512014032800491903_n.jpg?oh=55fa5de5ed0729dd1200611bce28e91b&oe=58B03EAE" class="img-circle">


  </div>


</div>