我正在使用json-schema-form构建表单,并且正在使用此库。https://www.npmjs.com/package/angular6-json-schema-form
这看起来不错,但我有一个问题。提交后,我想清除表格,但这是不可能的。
我无法在文档中找到方法,还搜索了stackoverflow并用谷歌搜索,但没有解决方案。因此,我在提交后使用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>
您需要创建一个对象,以使用默认值填充表单并将其绑定到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: ""
}