angular 路由配置
发布时间：2020-12-17 07:06:34 所属栏目：安全 来源：网络整理
导读：1. 新建一个app.routing.module.ts 文件，可以手动添加也可以命令生成 （ ng generate module app - routing -- flat -- module = app ） import { NgModule } from ‘@angular/core‘ ; import { Routes , RouterModule } from ‘@angular/router‘ ; // 组
|
1. 新建一个app.routing.module.ts 文件，可以手动添加也可以命令生成 （ng generate module app-routing --flat --module=app）
import { NgModule } from ‘@angular/core‘;
import { Routes,RouterModule } from ‘@angular/router‘;
// 组件引入
import { TemplateDirective } from ‘./directive/template-directive.component‘
import { AppComponent } from ‘./app.component‘;
const routes: Routes = [
? // { path: ‘‘,redirectTo: ‘directive‘,pathMatch: ‘full‘ },
? { path: ‘app‘,component: AppComponent? },
? { path: ‘directive‘,component: TemplateDirective }
];
@NgModule({
? imports: [RouterModule.forRoot(routes)],
? exports: [RouterModule]
})
export class AppRoutingModule { }
?2. 在根模块中引入（app.module.ts）
import { AppRoutingModule } from ‘./app-routing.module‘;
import { AppComponent } from ‘./app.component‘;
// 组件
import { TemplateDirective } from ‘./directive/template-directive.component‘
?
@NgModule({
? // 引入组件，指令
? declarations: [
??? AppComponent,
??? TemplateDirective,
??? InputTrimDirective
? ],
? imports: [
??? BrowserModule,
??? AppRoutingModule
? ],
? providers: [],
? bootstrap: [AppComponent]
})
export class AppModule { }
3. 路由入口
<router-outlet></router-outlet>
（编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |