Question

我正在使用json-schema-form构建表单，并且正在使用此库。 https://www.npmjs.com/package/angular6-json-schema-form

这看起来不错，但我有一个问题。提交后，我想清除表格，但这是不可能的。

我找不到文档中的方法，也搜索了stackoverflow和googled，但没有解决方案。因此，我在提交后使用Javascript清除了表单，但表单数据似乎保存在某处，因此无需任何操作即可重新提交。

这是代码

<json-schema-form
     *ngIf="isInquireForm"
     class="contact-form"
     loadExternalAssets="true"
     framework="no-framework"
     [options]="inquireFormOption"
     [schema]="inquireFormSchema"
     [form]="inquireFormLayout"
     (onSubmit)="onInquireSubmit($event)"
     (isValid)="inquireIsValidFn($event)"
     (validationErrors)="inquireValidationErrorsFn($event)">
</json-schema-form>

Answer 1

您需要创建一个对象，以使用默认值填充表单并将其绑定到json模式表单组件。需要重置时，清除对象中的数据。

data = {
   first_name: "abc",
   last_name: "xyz"
}

<json-schema-form
     *ngIf="isInquireForm"
     class="contact-form"
     loadExternalAssets="true"
     framework="no-framework"
     [options]="inquireFormOption"
     [schema]="inquireFormSchema"
     [form]="inquireFormLayout"
     [(data)]="data"
     (onSubmit)="onInquireSubmit($event)"
     (isValid)="inquireIsValidFn($event)"
     (validationErrors)="inquireValidationErrorsFn($event)">
</json-schema-form>

要清除表单，请重置data

data = {
   first_name: "",
   last_name: ""
}

提交后无法清除angular-json-schema-form

1 个答案: