Angular 自定义模块

无忧岛 發表於 2019-5-24 10:28:00

创建自定义模块
<div class="cnblogs_code">
<pre>ng g module mymodule</pre>
</div>
app.module.ts
<div class="cnblogs_code">
<pre>import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

//angular内置的模块
import { FormsModule } from '@angular/forms';

//angualr内置的模块
import { HttpClientModule } from '@angular/common/http';

import { AppComponent } from './app.component';
import { HomeComponent } from './components/home/home.component';
import { NewsComponent } from './components/news/news.component';

//上百个组件会导致页面加载比较慢所以要模块化

//引入自定义模块

import { UserModule } from './module/user/user.module';

import { ProductModule } from './module/product/product.module';

@NgModule({
declarations: [
AppComponent,
HomeComponent,
NewsComponent
],
imports: [
BrowserModule,
FormsModule,
HttpClientModule,
UserModule,
ProductModule
],
providers: [],
bootstrap:
})
export class AppModule { }</pre>
</div>
user.moudle.ts
<div class="cnblogs_code">
<pre>import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { CommonService } from './services/common.service';

import { ProfileComponent } from './components/profile/profile.component';
import { AddressComponent } from './components/address/address.component';
import { OrderComponent } from './components/order/order.component';
import { UserComponent } from './user.component';

@NgModule({

/*user模块里面的组件*/
declarations: ,

exports:,/*暴露组件让其他模块里面可以使用暴露的组件*/

providers:,
imports: [
CommonModule
]
})
export class UserModule { }</pre>
</div>
 

</div>
<div id="MySignature" role="contentinfo">
最后，关注【码上加油站】微信公众号后，有疑惑有问题想加油的小伙伴可以码上加入社群，让我们一起码上加油吧！！！ 
来源：https://www.cnblogs.com/loaderman/p/10916561.html

頁: [1]

琼殿技术论坛's Archiver

Angular 自定义模块