Angular 4材料项目没有编译

2 回答

• 2

  见Getting Started With Angular Material 2 (September 4, 2017)

  自定义材料模块在Angular Material 2 Beta 3之前，可以在应用程序模块中导入全局MaterialModule以使组件可用 . 缺点是树抖动不足以删除所有未使用的代码 . 因此，不推荐使用MaterialModule，而是支持定义特定于项目的自定义材料模块，您只需导入和导出所需的组件 . 这是我们的模块看起来像：

  不幸的是，官方指南并不像上面的文章那样明确 . 您需要遍历您使用的每个组件并导入模块，然后将其添加到AppModule的导入部分 .

  看起来您只是使用工具栏，因此您需要的唯一模块是MdToolbarModule .

  import { MdToolbarModule } from '@angular/material';
  
  @NgModule({
    imports: [
      ...
      MdToolbarModule,
    ],
  

  基本上，正如上面的文章解释的那样，你'自己动手'的MaterialModule . 主要目的似乎是避免在您的应用中部署未使用的材料组件 .

  回复于 2024-04-18T08:21:59+08:00
• 1

  实际上， MaterialModule 不再可导入，您需要导入所需的唯一模块，您可以在此处看到此信息：

  CHANGELOG.md#breaking-changes

  因此，如果您需要材料，只导入所需的组件模块，可以在此处查看组件列表：https://material.angular.io/components

  例如，如果我想要材料输入，请转到API tab查看要导入的内容：

  import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  
  import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
  import { MatMenuModule} from '@angular/material'; 
  import { FlexLayoutModule } from '@angular/flex-layout';
  
  import { AppComponent } from './app.component';
  import 'hammerjs';
  
  @NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      BrowserAnimationsModule,
      MatMenuModule,
      FlexLayoutModule
    ],
    providers: [],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  

  这是官方的掠夺者例子：http://plnkr.co/edit/o077B6uEiiIgkC0S06dd?p=preview

  无论如何，我没有看到您在HTML中使用材质组件的位置，因此不确定您要使用哪一个 .

  回复于 2024-04-18T08:21:59+08:00