要在Angular 6中在输入控件悬停时显示验证错误消息,您可以使用Angular内置的表单验证和Angular Material库。以下是一种解决方法的示例:
npm install @angular/material
import {MatInputModule, MatTooltipModule} from '@angular/material';
@NgModule({
...
imports: [
...
MatInputModule,
MatTooltipModule
],
...
})
export class AppModule { }
在上面的示例中,我们使用了required验证器来确保输入框中的内容不为空。使用nameInput.invalid和nameInput.touched属性来确定何时显示错误消息。我们还使用matTooltip指令来显示错误消息。
name: string;
.mat-error {
color: red;
}
.mat-tooltip {
background-color: red;
color: white;
}
通过按照上述步骤,在输入框悬停时,将在验证失败时显示错误消息。