角度2路线 [英] Angular 2 Routes

查看:65
本文介绍了角度2路线的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的app.html中有一个路由器插座.问题是我有3个(post,admin,addposts)组件,除了app.component.在我的posts组件中,我有下拉菜单,我单击下拉菜单,我想加载addposts,网址应类似于此帖子/添加帖子.任何想法如何做到这一点

I have one router-outlet in my app.html .problem is i have 3 (post,admin,addposts)component except app.component .in my posts component i have dropdown menu onece i click dropdown i want load addposts and the url should be look like this post/addposts. any idea how to do this

这是我的app.routes.ts

this is my app.routes.ts

   const routes: Routes = [

      { path: '',  redirectTo: 'main', pathMatch: 'full'},
      { path: 'main', component:AdminBodyComponent  },
      { path: 'admin', component:AdminComponent  },
      { path: 'posts',component:PostsComponent},
      { path: 'addposts',component:AddPostComponent}];

推荐答案

首先通过以下方式安装路由器:npm install router

first install router via: npm install router

import { Routes, RouterModule } from '@angular/router';


export const router: Routes = [
   { path: '',  redirectTo: 'main', pathMatch: 'full'},
  { path: 'main', component:AdminBodyComponent  },
  { path: 'admin', component:AdminComponent  },
  { path: 'posts',component:PostsComponent},
  { path: 'addposts',component:AddPostComponent}];

export const routes: ModuleWithProviders = RouterModule.forRoot(router);
step2:
inject into your .ts file
constructor(
  private router:Router,
  ...
)
step3:
this.router.navigate(['/addposts']);

step4:
<base href="/">

如果要使用特定的路由器,请执行此操作 步骤4:

if you want to use specific router go for this step4:

这篇关于角度2路线的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆