Material angular 7 – Punta de la herramienta

La<MatTooltip>, una Directiva Angular, se utiliza para mostrar un tooltip de estilo material.

En este capítulo, mostraremos la configuración requerida para mostrar un tooltip usando Material Angular.

A continuación se muestra el contenido del descriptor de módulo modificado app.module.ts .

importar{módulo de navegador}de@angular/plataforma-browser; importar{ngMódulo}de@angular/core;importar{AppComponent}de./app.import{BrowserAnimationsModule}de@angular/platform-browser/animations; import{MatButtonModule,MatTooltipModule}de@angular/materialimport{FormsModule,ReactiveFormsModule}de@angular/forms;@NgModule({ {@angular/forms
   declaraciones:[AppComponent],
   importaciones:[BrowserModule,BrowserAnimationsModule,MatButtonModule,MatTooltipModule,FormsModule,ReactiveFormsModule],
   proveedores:[],
   bootstrap:[AppComponent]})exportclassAppModule{}

A continuación se muestra el contenido del archivo host HTML modificado app.component.html .

mat-at-raised-buttonmatTooltip="Sample Tooltip "aria-label="Sample Tooltip">
   Haga clic en mí!

Resultado

Verifique el resultado.

Detalles

  • Aquí, hemos creado un botón usando el botón mat-botón en el cursor, mostraremos un tooltip.