Роутер angular2 интерпретирует маршрут как параметр?

Я пытаюсь перейти к дочернему модулю с параметрами маршрута, мой 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: невозможно прочитать свойство «длина» неопределенного

это, кажется, из-за использования неопределенного маршрута, и если я просто вызову /cell, тогда мой компонент загружается нормально и печатает cell на консоли. Почему маршрутизатор интерпретирует маршрут как параметр?


person George Edwards    schedule 02.12.2016    source источник


Ответы (1)


Используйте приведенный ниже код, чтобы получить идентификатор:

import { ActivatedRoute, Router } from '@angular/router';
constructor(public route: ActivatedRoute, ...) {
}
ngOnInit() {
    this.route
        .params
        .subscribe(params => {
            this.id= params['id'];
    });
}
person JS dev    schedule 02.12.2016
comment
Нет, боюсь, это не поможет. Я уверен, что это проблема маршрутизации, так как компонент отлично работает в другом проекте (я реорганизую эту функциональность в новый модуль, что и вызвало проблему). - person George Edwards; 02.12.2016