在主模块中导入MatButtonModule时,它无法正常工作

时间:2017-12-14 19:41:23

标签: angular angular-material2

在app文件夹中还有另一个名为module的子loginlogin.component.tslogin.module.tslogin.component.html。我想将angular-material用于login.component.html。如果我在login.module.ts中导入材料组件,那么它的工作正常。但是如果我在app.module.ts中导入它就不再有用了。

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import {MatButtonModule} from '@angular/material/button';
import { LoginModule }  from './login/login.module';
import { AppComponent } from './app.component';
import { loginRouting } from './login/login.routing';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,BrowserAnimationsModule,LoginModule,loginRouting,MatButtonModule
  ],
  exports: [MatButtonModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

那是我的app.module.ts。我的演唱会是,如果我在根模块中添加材料组件,我不需要导入任何sub module,因为所有子模块都是在根模块中导入的。请告知如何实现这一目标。我的代码中有什么问题。

1 个答案:

答案 0 :(得分:1)

如果您在AppModule中导入MatButtonModule,那么他的所有组件/指令仅在AppModule组件中可用。

您在导出部分添加了MatButtonModule,但除非您在LoginModule上导入AppModule,否则这不会使LoginModule中的MatButtonModule可用。

如果您想在所有模块中使用MatButtonModule,您应该考虑创建一个共享模块,如描述here

此共享模块应包含所有全局可用功能,而其他所有模块都应导入该功能。

希望有所帮助