導入上部模塊中的角材料不工作

我app.module.ts

.... 
import { NavbarComponent } from './a2-components/navbar/navbar.component'; 
import { SidebarComponent } from './a2-components/sidebar/sidebar.component'; 
import {AdminModule} from './admin/admin.module'; 

@NgModule({ 
    imports: [ 
    ... 
    AdminModule, 
    MaterialModule.forRoot(), 
    ... 
    ], 
    providers: [ ], 
    declarations : [ 
    ... 
    NavbarComponent, 
    SidebarComponent, 
    ... 
    ], 
    bootstrap: [ AppComponent ] 
}) 

export class AppModule { 

}

我admin.module

... 
import { AdminComponent }  from './admin.component'; 
import { HomeComponent }  from './home/home.component'; 
import { AdminService }  from './admin.service'; 

@NgModule({ 
    imports: [ ... ], 
    declarations: [ AdminComponent, HomeComponent ], 
    providers:[ AdminComponent, AdminService ] 
}) 
export class AdminModule {}

的app.module比admin.module分層較大的模塊。我正在導入@ angular/material，NavbarComponent和SidebarComponent，但是我得到一個錯誤，在模塊admin.module中找不到材質，NavbarComponent和SidebarComponent。

錯誤圖像：

可能有人給我一個提示？

來源

2017-05-22 Renato Souza

基本上你不會在AdminModule或任何其他模塊的作用域中導入所需的組件聲明（並且所有'MaterialModule'都會捆綁**所有**組件聲明）。僅僅因爲你導入到AppModule中，組件不會自動地被其他'NgModule'裝置使用。這實際上是Angular「模塊」中的一部分。你應該期望成爲全球的唯一的東西是「服務」。「物質」項目不再出口。 –

很好的解釋。非常感謝你，我的朋友！ –

我們可以看到你的angular-cli.json，index.html或Style.css嗎？

當您爲樣式添加框架（如引導程序）時，必須將CSS鏈接到新框架。

添加此行您的style.css：

@import '~https://fonts.googleapis.com/icon?family=Material+Icons'; 
@import '[email protected]/material/core/theming/prebuilt/deeppurple-amber.css'; 
@import '../node_modules/bootstrap/dist/css/bootstrap.min.css';

其他想，當我在一個模塊中添加的材料，只是把這個代碼：

import { MaterialModule } from '@angular/material'; 

@NgModule({ 
imports: [ 
    MaterialModule, 
]})

這爲我工作。

來源

2017-05-22 00:33:24 Dekonunes

非常感謝你回答我。但回答我一件事。您是否將角材料導入每個子模塊？我在app.module中導入，它適用於app.module的組件，但不適用於子模塊。我想創建一個共享模塊來導入到每個模塊中，但是我擔心繫統過載。 –

是的，只是在使用材料的組件中導入，我很久以前就導入了材質，但我認爲嘗試導入也是你想要的，沒有成功。我的應用程序很簡單，無法測試性能。我認爲這是創建共享模塊的一種方式，將來也會嘗試。 – Dekonunes

@DaniloSantos應該注意的是，儘管你可以像這樣導入MaterialModule，但你實際上不應該這樣做。這會在運送應用程序的生產版本時搞亂任何「樹木搖動」優化。相反，只需導入實際在應用程序模塊範圍內使用的組件所需的模塊。應該考慮使用'MaterialModule'和'MaterialModule.forRoot（）'。預計這些出口將在未來的版本中消失。 –

導入上部模塊中的角材料不工作

回答

相關問題