ng-touching not reset on .markAsUntouched for Custom Control

Question

我在Angular 2表单中有一个简单的自定义控件，当您编辑该字段然后通过 .markAsUntouched 重置它时，它不会删除 ng-触及了课程。

示例表单如下所示：

<form #editForm="ngForm">
    <input [(ngModel)]="title" name="title2" type="text"/>
    <app-textbox label="Template Driven Model" [showLabel]="true" 
     [(ngModel)]="title" name="title"> </app-textbox>
     <button (click)="resetTempalteDriven()">Reset Template Driven</button>
 </form>

在此示例中，独立输入控件正确重置。 app-textbox组件的html如下所示：

<div>
<div class="fg-line">
    <label *ngIf="label && showLabel" [ngClass]="{ 'font-bold': required }">{{label}}</label>
    <input type="text"   style="cursor: text" 
        [(ngModel)]="value" [required]="required" [disabled]="disabled" [placeholder]="placeholder" [id]="identifier" />
</div>

表单的重置如下所示：

  resetTempalteDriven(){ 

      this.editForm.form.markAsPristine();
      this.editForm.form.markAsUntouched();

      this.editForm.controls["title"].markAsUntouched();
   }

我已将整个应用放在https://github.com/jmarbutt/ng2-angular-issue

在触摸两个输入字段然后点击重置后，表单看起来像这样。

此时它们都应该是白色的。

所以我的问题是为什么ng-touch在 markAsUntouched 上没有正确删除？

Answer 1

将按钮类型设置为按钮可以解决我的问题