材质角度 - 无法正常工作

Question

https://material.angular.io/guide/getting-started

ng new testapp
cd testapp
npm install --save @angular/material @angular/cdk
npm install --save @angular/animations
ng serve

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatFormFieldModule, MatInputModule } from '@angular/material';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    MatFormFieldModule,
    MatInputModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.html

<p>Test Angular Material</p>

<form>
  <mat-form-field class="example-full-width">
    <input matInput placeholder="Favorite food" value="Sushi">
  </mat-form-field>
</form>

app.component.css

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

在他们的网站上没有正常的链接。

我很确定我忘记了什么，但我在他们的网站上到处都看，甚至不知道是什么......

谢谢您的帮助。

Answer 1

主题的导入通常在style.css样式表中。

Answer 2

如果问题是点击输入的材料动画不能正常工作，你可能没有定义材料的主题：转到你的src文件夹里面的styles.css并写下线条主题

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

选择另一个主题：consider Angular's theme guide。