好吧,我的代碼非常簡單,但我不知道如何首先將名稱傳遞給警報,如果我弄清楚了,我也許可以將它們傳遞給后端(可能)。
html:
<div class="container">
<h1>Update Account Info</h1>
<form>
<label for="firstName">First Name </label>
<div class="form-group">
<input type="text" class="form-control" id="firstName">
</div>
<label for="secondName">Second Name </label>
<div class="form-group">
<input type="text" class="form-control" id="secondName">
</div>
<label for="lastName">Last Name </label>
<div class="form-group">
<input type="text" class="form-control" id="lastName">
</div>
<button (click)="onClick($event)" class="update-btn" id="update-btn">Update</button>
</form>
</div>
ts:
import { IdToken } from '@azure/msal-common';
@Component({
selector: 'edit-profile',
templateUrl: './edit-profile.component.html',
styleUrls: ['./edit-profile.component.scss']
})
export class EditProfileComponent implements OnInit {
constructor() { }
ngOnInit() {
}
onClick(){
}
}
uj5u.com熱心網友回復:
對于反應形式,請查看此鏈接“https://www.tektutorialshub.com/angular/angular-reactive-forms/”
OR 檢查下面的代碼
HTML Code
<div class="container">
<h1>Update Account Info</h1>
<form>
<label for="firstName">First Name </label>
<div class="form-group">
<input type="text" class="form-control" id="firstName" [(ngModel)]="formData.firstName">
</div>
<label for="secondName">Second Name </label>
<div class="form-group">
<input type="text" class="form-control" id="secondName" [(ngModel)]="formData.secondName">
</div>
<label for="lastName">Last Name </label>
<div class="form-group">
<input type="text" class="form-control" id="lastName" [(ngModel)]="formData.lastName">
</div>
<button (click)="onClick()" class="update-btn" id="update-btn">Update</button>
</form>
</div>
TS File Code
export class EditProfileComponent implements OnInit {
public formData = {
firstName:'',
secondName:'',
lastName:'',
}
constructor() { }
ngOnInit() {}
onClick(){
console.log(this.formData);
}
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/363688.html
標籤:javascript html 有角的 打字稿 形式
