Question

我正在学习Angular，我不知道如何重置模板驱动表单的验证。

在官方教程中，他们展示了一种重置表单的方法，即使未修改的字段为空，它也不会显示任何错误消息，但这对我不起作用。

这是该应用程序的官方示例，其中“新英雄（重置）”和“新英雄（重置）”似乎导致相同的情况（输入左侧的红色错误指示器“名称”名称下输入“是必填项”警告）。我删除了输入中的值，然后按了按钮，但错误消息仍然存在：

https://stackblitz.com/angular/kmoqyljrgve

<form (ngSubmit)="onSubmit()" #heroForm="ngForm">
  <div class="form-group">
    <label for="name">Name</label>
    <input type="text" class="form-control" id="name"
           required
           [(ngModel)]="model.name" name="name"
           #name="ngModel">
    <div [hidden]="name.valid || name.pristine"
         class="alert alert-danger">
      Name is required
    </div>
  </div>

  <div class="form-group">
    <label for="alterEgo">Alter Ego</label>
    <input type="text" class="form-control" id="alterEgo"
           [(ngModel)]="model.alterEgo" name="alterEgo">
  </div>

  <div class="form-group">
    <label for="power">Hero Power</label>
    <select class="form-control" id="power"
            required
            [(ngModel)]="model.power" name="power"
            #power="ngModel">
      <option *ngFor="let pow of powers" [value]="pow">{{pow}}</option>
    </select>
    <div [hidden]="power.valid || power.pristine" class="alert alert-danger">
      Power is required
    </div>
  </div>

  <button type="submit" class="btn btn-success" [disabled]="!heroForm.form.valid">Submit</button>
  <button type="button" class="btn btn-default" (click)="newHero(); heroForm.reset()">New Hero</button>
  <i>with</i> reset

  &nbsp;&nbsp;
  <button type="button" class="btn btn-default" (click)="newHero()">New Hero</button>
  <i>without</i> reset

 <!-- NOT SHOWN IN DOCS -->
  <div>
    <hr>
    Name via form.controls = {{showFormControls(heroForm)}}
  </div>
 <!-- - -->
</form>

任何人都可以解释一下或告诉我我被误解了吗？

预先感谢

Answer 1

您可以使用resetForm表单来重置表单。

form.resetForm();

表单是表单heroForm的实例

Answer 2

a <- c(10, 23, 57, 37, 59, 25, 63, 33)
low_val  <- 10
high_val <- 70
a_breaks <- seq(low_val, high_val, 10)
res <- cut(a, a_breaks, include.lowest = T)
as.vector(table(res))
[1] 1 2 2 0 2 1

重置角度模板驱动的表单？

2 个答案: