上一节解决了用户注册和登录数据的内容。本节开始分析用户模块和用户路由。##用户管理模块UserModule分析##UserModule主要代码如下:import{NgModule}from'@angular/core';从'@angular/common'导入{CommonModule};从'./login/login.import{LoginComponent}组件';从'./users/users.component'导入{UsersComponent};从'./users-routing.module'导入{UsersRoutingModule};从'./home/home.component'导入{HomeComponent};导入{RegistComponent}from'./regist/regist.component';@NgModule({imports:[CommonModule,FormsModule,ReactiveFormsModule,UsersRoutingModule,],declarations:[UsersComponent,LoginComponent,HomeComponent,RegistComponent,]})exportclassUsersModule{}import数组中,CommonModule:是构建子组件必须引入的模块。用户登录控件(LoginComponent)使用模板驱动的表单,需要导入FormsModule。用户注册组件(RegistComponent)使用响应式表单,需要导入ReactiveFormsModule。用户路由模块UsersRoutingModule主要代码如下:import{NgModule}from'@angular/core';import{RouterModule,Routes}from'@angular/router';import{LoginComponent}from'./login/login.component';从'./users/users.component'导入{UsersComponent};从'./home/home.component'导入{HomeComponent};从'./regist/regist.component'导入{RegistComponent};constusersRoutes:Routes=[{path:'',component:UsersComponent,children:[{path:'',component:HomeComponent},{path:'login',component:LoginComponent},{path:'regist',component:RegistComponent}]},];@NgModule({imports:[RouterModule.forChild(usersRoutes)],exports:[RouterModule]})exportclassUsersRoutingModule{}进入首页(localhost)时,因为AppRoutingModule被直接重定向到了users,直接进入users路由。进入用户路由后,直接加载用户模块的UsersRoutingModule。当路由为''时,加载UsersComponent组件。UsersComponent组件只有一个路由出口标签:
