角度2 |防止点击按钮清除表格

时间:2018-10-03 04:44:51

标签: angular forms

我的表单上有一个按钮,用于将一个项目添加到对象的数组中。

<form (ngSubmit)="submit()" #myForm="myForm" class="form-horizontal" style="direction: ltr"> 
  <div class="row">
    <div class="col-md-6">
      <div class="form-group">
        <label class="control-label col-sm-3">Transaction ID:</label>
        <div class="col-sm-9"> 
          <input type="text" class="form-control" [(ngModel)]="asn.TRANSACTION_ID" name="TRANSACTION_ID" placeholder="Enter password">
        </div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-1 col-md-offset-11">
      <button  class="btn btn-info" (click)="AddEmptyLot($event)">Add Item</button>
    </div>
  </div>

  <div class=lot-row *ngFor="let item of asn.itemsList;let i = index">
    <div class="row lot-row">
      <div class="col-md-6">
        <div class="form-group">
          <div class="col-sm-1"><button class="btn btn-danger" type="button" (click)="removeLot(i)">X</button></div>
          <label class="control-label col-sm-3">ITEM ID:</label>
          <div class="col-sm-8"> 
            <input type="text" class="form-control" [(ngModel)]="item.ITEM_ID" name="itemid" placeholder="ITEM ID">
          </div>
        </div>
      </div>
      <div class="col-md-6">
        <div class="form-group">
          <label class="control-label col-sm-4" >Customer Part Number:</label>
          <div class="col-sm-8"> 
            <input type="text" class="form-control" [(ngModel)]="item.CUST_PART_NUMBER" name="custpart" placeholder="Customer Part Number">
          </div>
        </div>
      </div>
    </div>
  <button type="submit"  class="btn btn-default">Submit</button>
</form>

当单击添加按钮时,该功能按预期运行,但是该表单被重置。

如何防止这种行为?

感谢助手。

1 个答案:

答案 0 :(得分:-1)

如果您需要保留已经在表单中输入的值,可以执行

var type1s = rules.Select(x => x.type1);
var type2s = rules.Select(x => x.type2);

context.stage
       .Where(q => q.stageID == stageID && !type1s.Contains(q.type1) && !type2s.Contains(q.type2))
       .GroupBy(q => q.stageKey)
       .Select(g => g) ;