如何使用 angular 使用户输入等于 If 条件时导航的函数
How to make a function that navigate when user input equal to the If Condition Using angular
我想创建一个函数来检查用户输入是否等于(用户名:“marwen”,密码:“hamdi”),然后导航到 URL 'apps/e-commerce/products'
这是打字稿:
ngOnInit(): void{
this.loginForm = this._formBuilder.group({
email : ["", [Validators.required] ],
password: ["", Validators.required]
});
}
check(){
if (this.email.value==="marwen"&& this.password.value==="hamdi"){
this.router.navigate(['apps/e-commerce/products'])
}
}
这是 HTML 部分,我希望在单击按钮时执行该功能。
<form name="loginForm" [formGroup]="loginForm" novalidate >
<mat-form-field appearance="outline" style="color:white;">
<mat-label style="color:white;">Nom d'Utilisateur</mat-label>
<input matInput formControlName="email" id="email">
<mat-icon matSuffix class="secondary-text" style="color:white;">
supervised_user_circle
</mat-icon>
<mat-error *ngIf="loginForm.get('email').hasError('required')">
Nom d'utilisateur est requis
</mat-error>
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label style="color:white;">Mot De Passe</mat-label>
<input matInput type="password" formControlName="password" id="password">
<mat-icon matSuffix class="secondary-text" style="color:white;" >vpn_key</mat-icon>
<mat-error>
Mot De Passe est requis
</mat-error>
</mat-form-field>
<button mat-raised-button color="accent" class="submit-button" aria-label="LOG IN" [disabled]="loginForm.invalid" (click)="check()" >
Connexion
</button>
</form>
我希望您仅将此验证用作测试或模拟您的登录。无论如何,这可以帮助你:
ngOnInit() {
// do something with this subscription
this.loginForm.valueChanges.subscribe(values => {
if (values.email === "marwen" && values.value==="hamdi") {
this.router.navigate(['apps/e-commerce/products'])
}
});
}
我想创建一个函数来检查用户输入是否等于(用户名:“marwen”,密码:“hamdi”),然后导航到 URL 'apps/e-commerce/products'
这是打字稿:
ngOnInit(): void{
this.loginForm = this._formBuilder.group({
email : ["", [Validators.required] ],
password: ["", Validators.required]
});
}
check(){
if (this.email.value==="marwen"&& this.password.value==="hamdi"){
this.router.navigate(['apps/e-commerce/products'])
}
}
这是 HTML 部分,我希望在单击按钮时执行该功能。
<form name="loginForm" [formGroup]="loginForm" novalidate >
<mat-form-field appearance="outline" style="color:white;">
<mat-label style="color:white;">Nom d'Utilisateur</mat-label>
<input matInput formControlName="email" id="email">
<mat-icon matSuffix class="secondary-text" style="color:white;">
supervised_user_circle
</mat-icon>
<mat-error *ngIf="loginForm.get('email').hasError('required')">
Nom d'utilisateur est requis
</mat-error>
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label style="color:white;">Mot De Passe</mat-label>
<input matInput type="password" formControlName="password" id="password">
<mat-icon matSuffix class="secondary-text" style="color:white;" >vpn_key</mat-icon>
<mat-error>
Mot De Passe est requis
</mat-error>
</mat-form-field>
<button mat-raised-button color="accent" class="submit-button" aria-label="LOG IN" [disabled]="loginForm.invalid" (click)="check()" >
Connexion
</button>
</form>
我希望您仅将此验证用作测试或模拟您的登录。无论如何,这可以帮助你:
ngOnInit() {
// do something with this subscription
this.loginForm.valueChanges.subscribe(values => {
if (values.email === "marwen" && values.value==="hamdi") {
this.router.navigate(['apps/e-commerce/products'])
}
});
}