如何清除对话框材质内部的形状棱角2

Question

我在角度2素材上创建了一个对话框。我打开模态如下：

我的组件

....
private refDialog;
@ViewChild('display') display;

openDialog() {
    this.refDialog= this.dialog.open(this.display);
}
....

我的HTML

<ng-template #display>
    <form (ngSubmit)="onSubmit(f)" #f="ngForm">
        <div class='col-md-12'>
            <md-input-container>
                <input mdInput placeholder="Name" name="name" [(ngModel)]="product.name" #name="ngModel">
            </md-input-container>
        </div>

        .....

    </form>
</ng-template>

我需要在打开对话框之前清除表单。我想尽可能简单地做到这一点。我正在使用primeNG对话框，并使用了this.f.reset（）;它奏效了。但角材料2的工作方式不同。

我尝试了一切都没有成功。这对我不起作用：

....
private refDialog;
@ViewChild('display') display;
@ViewChild('f') f;

openDialog() {
    this.f.reset();
    this.refDialog= this.dialog.open(this.display);
}

....

任何人都可以帮助我吗？

Answer 1

看看我创建的Plunker演示：HERE

这是对话框组件：

export class DialogComponent implements OnInit{
  @ViewChild('myform') myform;
  constructor(public dialogRef: MdDialogRef<DialogComponent>){}
  ngOnInit() {
  this.myform.resetForm();
  }
}

这是根组件：

openDialog(){
  this.dialog.open(DialogComponent);
}

正如您在GIF中看到的那样，每当HTML中的硬编码输入值被清除并且表单处于脏状态时，表格如何被清除，以便使用resetForm()方法完全休息