Angular 角度材质工具提示未按预期显示

我一直在各个教程网站上搜索，试图找到实用的工具提示。非常令人沮丧，因为它看起来非常简单。控制台不显示任何错误或警告。我用的是角度11。我的理解是，一旦我将MatTooltipModule导入我的app.module.ts，那么该功能将可用于同一模块中的所有组件

npm list @angular/core
finfo@0.0.0 C:\source\finfo
+-- @angular/core@11.2.9
`-- codelyzer@6.0.1
  `-- @angular/core@9.0.0
npm list @angular/material
C:\source\finfo
`-- @angular/material@11.2.8

....app.module.ts....
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { MatCardModule } from '@angular/material/card';
import { MatButtonModule } from '@angular/material/button';
import { MatTooltipModule } from '@angular/material/tooltip';
....app.module.ts....
imports: [
    HttpClientModule,
    BrowserModule,
    BrowserAnimationsModule,
    FormsModule,
    MatButtonModule,
    MatCardModule,
    MatTooltipModule,
    ReactiveFormsModule,
    RouterModule.forRoot(appRoutes),

....store.html....
<div>
  <button matTooltip="Info about the action"
      matTooltipPosition="above"
      class="example-button">
      Action
  </button>
</div>

角度/核心的npm列表 finfo@0.0.0C:\source\finfo +--@棱角/core@11.2.9 `-- codelyzer@6.0.1 `--@棱角/core@9.0.0 角度/材料的npm列表 C:\source\finfo `--@棱角/material@11.2.8 …应用程序模块ts。。。。 从“@angular/platform browser”导入{BrowserModule}； 从“@angular/platform browser/animations”导入{BrowserAnimationsModule}； 从'@angular/forms'导入{FormsModule，ReactiveFormsModule}； 从“@angular/core”导入{NgModule}； 从'@angular/router'导入{RouterModule，Routes}； 从'@angular/common/http'导入{HttpClientModule}； 从“@angular/material/card”导入{matcardmodel}； 从“@angular/material/button”导入{MatButtonModule}； 从“@angular/material/tooltip”导入{MatTooltipModule}； …应用程序模块ts。。。。 进口：[ HttpClientModule， 浏览器模块， BrowserAnimationsModule， FormsModule， MatButtonModule， MatCardModule， MatTooltipModule， 反应形式模块， 根路径模块（批准）， …store.html。。。。 行动

更新：Zunayed Shahriar提供的答案是正确的。无论出于什么原因，我的一个小附录在将@import语句移到.css文件顶部后，我的项目开始使用工具提示。

对我来说效果很好

确保在

style.CSS

文件中导入材质CSS（取决于主题）

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

演示在

结果：

---

那么这就是主style.css文件中的内容了？要么不是，要么还有其他内容。不，只有

styles.css

或

styles.scss

。查看演示。没有其他内容。谢谢，演示效果很好。但我仍然无法进入现有的项目…有一些东西使它无法工作。因此，在绝望中，我移动了@import语句从.css的底部到顶部。现在它可以工作了。里面一定有什么东西发生了冲突。