Winkelmaterial 7 - Tooltip
Das <MatTooltip>, eine Winkelrichtlinie, wird verwendet, um einen Tooltip im Materialstil anzuzeigen.
In diesem Kapitel wird die Konfiguration vorgestellt, die erforderlich ist, um einen Tooltip mit Angular Material anzuzeigen.
Es folgt der Inhalt des modifizierten Moduldeskriptors app.module.ts.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MatButtonModule,MatTooltipModule} from '@angular/material'
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
BrowserAnimationsModule,
MatButtonModule,MatTooltipModule,
FormsModule,
ReactiveFormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Es folgt der Inhalt der geänderten HTML-Hostdatei app.component.html.
<button mat-raised-button
matTooltip = "Sample Tooltip"
aria-label = "Sample Tooltip">
Click Me!
</button>
Ergebnis
Überprüfen Sie das Ergebnis.
Einzelheiten
- Hier haben wir eine Schaltfläche mit mat-button on hover erstellt. Wir zeigen einen Tooltip.