javascript - 如何使用 mat-checkbox 进行验证?
问题描述
我想知道如何检查复选框是否被选中,如果未选中,则会为用户显示一条错误消息。我设法输入了错误消息,但无法将其与表单的其余部分一起使用。你能帮助我吗?这是我必须做的。
<mat-checkbox class="hcs-full-width" [formControl]="termsFormControl"> Aceite os termos de uso
</mat-checkbox>
<mat-error *ngIf="termsFormControl.hasError('required')">
Termo é
<strong>requirido</strong>
</mat-error>
.ts
export class AppComponent implements OnInit {
private subscription: Subscription;
uri: string;
ssid: string;
sessiondId: string;
ip: string;
mac: string;
ufi: string;
mgmtBaseUrl: string;
clientRedirectUrl: string;
req: string;
userName: string;
hmac: string;
name: string;
email: string;
constructor(@Inject(DOCUMENT) private document: any, private route: ActivatedRoute) {
}
ngOnInit() {
this.route.queryParams
.filter(params => params.mac)
.subscribe(params => {
console.log(params);
this.ssid = params.ssid;
this.sessiondId = params.sessionId;
this.ip = params.ip;
this.mac = params.mac;
this.ufi = params.ufi;
this.mgmtBaseUrl = params.mgmtBaseUrl;
this.clientRedirectUrl = params.clientRedirectUrl;
this.req = params.req;
this.hmac = params.hmac;
});
console.log("LOGAR: " + this.nameFormControl.valid);
console.log("LOGAR: " + this.termsFormControl.valid);
}
Logar() {
if (this.nameFormControl.valid && this.emailFormControl.valid && this.termsFormControl.valid) {
this.userName = this.name + ";" + this.email;
this.uri = "#" + this.ssid + "&sessionId=" + this.sessiondId + "&ip=" + this.ip + "&mac=" + this.mac + "&ufi=" + this.ufi + "&mgmtBaseUrl=" + this.mgmtBaseUrl + "&clientRedirectUrl=" + this.clientRedirectUrl + "&req=" + this.req + "&username=" + this.userName + "&hmac=" + this.hmac;
// console.log("LOGAR: " + this.nameFormControl.valid);
this.document.location.href = this.uri;
}
console.log("LOGAR: " + this.nameFormControl.valid);
console.log("LOGAR: " + this.termsFormControl.valid);
};
emailFormControl = new FormControl('', [
Validators.required,
Validators.email,
]);
nameFormControl = new FormControl('', [
Validators.required,
]);
termsFormControl = new FormControl('', [
Validators.required,
]);
}
解决方案
Use build-in validator: Validators.requiredTrue
推荐阅读
- excel - 将表 1 中的列标题链接到表 2 中的父类别以用于报告过滤器
- node.js - 如何在 sequelize 中创建父/子关联?
- swift - 我使用泛型类型并设置了一个 nil 值,但结果是 `nil == nil` 为 false。如何解决这个问题呢?
- asp.net - 如果 Web.Config 保护所有 cookie,我怎么能不保护 Asp.Net 中的一个 cookie?
- java - Apache POI - 在 Excel 工作表中插入逗号(,)
- c# - Linq 尝试在 groupBy 之后使用 Include
- android - 将 Unity Humaniod 导入 Android App 并传递实时数据
- python - 使用 pyautoit 在游戏中移动光标使光标始终向上/向下
- python - 我正在尝试修复值错误以防用户输入字母
- laravel - 如何将数据传递给所需的 vue 组件?