[英]How to show value after submit button in angular?
I made a form in Angular where, when user submit a form - new value show be shown under the form , I tried everything as per my knowledge but nothing works, currently labels of below form is showing without click, I need to show everything once where clicked submit button!我在 Angular 中制作了一个表格,当用户提交表格时-新值显示在表格下方,我根据我的知识尝试了所有但没有任何效果,目前下面表格的标签显示没有点击,我需要显示所有内容一次点击提交按钮的地方!
HTML FILE HTML 文件
<div class="form-field col-lg-12">
<input class="submit-btn" type="submit" value="click" (click)="update">
</div>
<div class="form-field col-lg-12">
<input class="submit-btn" type="submit" value="click" (click)="update">
</div>
<div *ngIf="display">
<section class="admin-form">
<form class="contact-form row">
<div class="form-field col-lg-6" >
<label class="label" for="name">Article ID</label>
<label class="label infolabel" for="name">Fc409702-683e-11eb-Bc5e-54ee750463ec</label>
</div>
<div class="form-field col-lg-6 ">
<label class="label" for="company">Title</label>
<label class="label infolabel" for="company">SKF India Logs Nearly 2-Fold Rise In Q3 Net Profit</label>
</div>
<div class="form-field col-lg-6">
<label class="label" for="message">Publication, Edition</label>
<label class="label infolabel" for="message">Times Of India, Mumbai</label>
</div>
<input class="submit-btn" type="button" value="Delete" data-toggle="modal" data-target="#popup1">
</div>
</form>
</section>
</div>
TS FIle文件
export class MainComponent implements OnInit {
constructor() { }
display = true;
ngOnInit(): void {
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
}
update(){
this.display = !this.display;
}
}
I made a form in Angular where, when user submit a form - new value show be shown under the form , I tried everything as per my knowledge but nothing works, currently labels of below form is showing without click, I need to show everything once where clicked submit button!我在 Angular 中制作了一个表单,当用户提交表单时- 表单下显示新值显示,我根据我的知识尝试了所有方法,但没有任何效果,目前以下表单的标签无需点击即可显示,我需要显示所有内容一次点击提交按钮的地方!
HTML FILE HTML 文件
<div class="form-field col-lg-12">
<input class="submit-btn" type="submit" value="click" (click)="update">
</div>
<div class="form-field col-lg-12">
<input class="submit-btn" type="submit" value="click" (click)="update">
</div>
<div *ngIf="display">
<section class="admin-form">
<form class="contact-form row">
<div class="form-field col-lg-6" >
<label class="label" for="name">Article ID</label>
<label class="label infolabel" for="name">Fc409702-683e-11eb-Bc5e-54ee750463ec</label>
</div>
<div class="form-field col-lg-6 ">
<label class="label" for="company">Title</label>
<label class="label infolabel" for="company">SKF India Logs Nearly 2-Fold Rise In Q3 Net Profit</label>
</div>
<div class="form-field col-lg-6">
<label class="label" for="message">Publication, Edition</label>
<label class="label infolabel" for="message">Times Of India, Mumbai</label>
</div>
<input class="submit-btn" type="button" value="Delete" data-toggle="modal" data-target="#popup1">
</div>
</form>
</section>
</div>
TS FIle TS文件
export class MainComponent implements OnInit {
constructor() { }
display = true;
ngOnInit(): void {
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
}
update(){
this.display = !this.display;
}
}
On (click)
you call update
which I'm guessing is a function in your.ts.在
(click)
你调用update
,我猜它是 your.ts 中的 function。
If so, your.ts file can have something like this:如果是这样,你的 .ts 文件可以有这样的东西:
display: boolean = false;
/*...*/
update() {
...
this.display = true;
...
}
Then you *ngIf=display
will trigger and show whatever is contained within然后你
*ngIf=display
将触发并显示其中包含的任何内容
In the click
handler, update
should have ()
, like so:在
click
处理程序中, update
应该有()
,就像这样:
<div class="form-field col-lg-12">
<input class="submit-btn" type="submit" value="click" (click)="update()">
</div>
<div class="form-field col-lg-12">
<input class="submit-btn" type="submit" value="click" (click)="update()">
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.