Looking for help with integrating mdb tooltips into my angular project. Specifically, I need to display a tooltip on the password input to highlight user restrictions.
I attempted to use data-mdb-toggle="tooltip" along with the title in the html input tag, but it seems that mdb tooltips require initialization. I'm not sure how to achieve this using TypeScript. Here's an example from my .ts file:
import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.scss']
})
export class RegisterComponent implements OnInit {
registerForm!: FormGroup;
constructor() {}
ngOnInit(): void {
this.registerForm = new FormGroup({
nome: new FormControl(null, Validators.required),
cognome: new FormControl(null, Validators.required),
team: new FormControl(null, Validators.required),
genere: new FormControl(null, Validators.required),
anno: new FormControl(null, [Validators.required, Validators.max(2005), Validators.min(1964)]),
email: new FormControl(null, [Validators.required, Validators.email]),
password: new FormControl(null, [Validators.required,Validators.pattern('(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&].{8,}')]),
})
}
onSubmit() {
console.log(this.registerForm);
}
}