繁体   English   中英

angular2路由器将路由解释为参数?

[英]angular2 router interpreting route as parameter?

我正在尝试使用路由参数路由到子模块,我的app.routes看起来像

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

const appRoutes: Routes = [
  { path: 'cell', loadChildren: './cell/cell.module#CellModule', pathMatch: 'prefix'}
];

export const appRoutingProviders: any[] = [];
export const routing = RouterModule.forRoot(appRoutes);

我的子组件(单元)具有以下路线:

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

import { CellComponent } from './cell.component';

const cellRoutes: Routes = [
    { path: ':id', component: CellComponent, pathMatch: 'full' }
];

export const cellRouting: ModuleWithProviders = RouterModule.forChild(cellRoutes);

CellComponent看起来像这样:

export class CellComponent implements OnInit {
  @Input()
  dep: string;

  constructor(
    private route: ActivatedRoute) { }

  ngOnInit() {
    this.route.params.forEach((params: Params) => {
      this.dep = params['id'];
      console.log(this.dep);
    });

  }
}

我希望能够调用/cell/2路由并在控制台中获得2 ,但是,如果进行该调用,则会收到错误消息:

TypeError:无法读取未定义的属性“ length”

这似乎是因为使用了未定义的路由,如果我只调用/cell那么我的组件会正常加载并将cell打印到控制台。 路由器为什么将路由解释为参数?

使用以下代码获取ID:

import { ActivatedRoute, Router } from '@angular/router';
constructor(public route: ActivatedRoute, ...) {
}
ngOnInit() {
    this.route
        .params
        .subscribe(params => {
            this.id= params['id'];
    });
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM