我有一个创建操作的页面。在我的页面中,我有1个表单和2个字段。如果我重新加载页面(或代码window.reload
),我可以在该表单中看到更新。但我想通过按下按钮单击来触发表单的刷新。
所以请帮我写一个函数,可以刷新表单(或任何其他html元素,如tabe/paragraph/etc.)
我的表单的**.html:**
<form class="was-validated" #zoneForm=ngForm id=#zoneForm>
<div class=container>
<div class="row justify-content-center">
<div class="col-5">
<div class="card" style="width: 35rem;">
<div class="card-header">
<div class="row">
<div class="col-11">
Zone Entry
</div>
<div class="col-1">
<i style="margin-left: -1rem;" class="fa fa-arrow-circle-o-right" aria-hidden="true"></i>
</div>
</div>
</div>
<div class="card-body">
<div class="row mb-1">
<div class="col-12">
<input [(ngModel)]="code" name="code" type="number" class="custom_form_control custom input" placeholder="ID" style="padding: 0px;"
disabled>
</div>
</div>
<div class="row mb-1">
<div class="col-12">
<input [(ngModel)]="zonename" name="zonename" type="text" class="custom_form_control custom-input" placeholder="Zone Name" required>
<i class="fa fa-user" style="margin-left: -1rem;font-size: 1rem; color:black;margin-top: 0.25rem;"></i>
</div>
</div>
<div class="row ">
<div class="col-12 ">
<button type="button " class="btn btn-outline-primary" style="margin-left: 90%; " (click)="createZone()">Save</button>
</div>
</div>
</div>
<!-- </div> -->
</div>
</div>
</div>
</div>
</form>
应通过单击保存按钮调用该函数
5条答案
按热度按时间tyg4sfes1#
您可以使用
ngOnChanges()
示例:组件.ts文件
wfypjpf42#
我建议您使用ReactiveFormModule,因为它非常强大,并且是在Angular中使用表单的最佳方式:
表格示例:
component.ts
component.html
我建议你看看角React形式文件:https://angular.io/guide/reactive-forms
看这个例子:https://stackblitz.com/edit/angular-ivy-zevbtg?file=src/app/app.component.html
您应该记住ngModel将被弃用,以便在下一个版本中使用表单...
j2qf4p5b3#
请在方法中使用ngOnInit(),而不刷新页面。
c8ib6hqw4#
kdfy810k5#
我有一个场景,我需要更新一个HTML结构,该结构在调用打印方法之前使用布尔值显示页面的一部分。