親ルートから子ルート(「id」と「タイプ」と呼ばれます)を取得しようとしていますが、未定義です。角2 - 子ルートを取得できません(未定義)
子供CERTS_ROUTES(app.routing.ts)を持つ親ルート:私が使用している
import { Routes } from '@angular/router';
import { CertsComponent } from './certs.component';
import { CertDifficultyComponent } from './cert-difficulty/cert-difficulty.component';
import { CertTitleComponent } from './cert-title/cert-title.component';
export const CERTS_ROUTES: Routes = [
{ path: '', component: CertTitleComponent },
{ path: ':id', component: CertTitleComponent },
{ path: ':type', component: CertTitleComponent },
{ path: ':id/:type', component: CertTitleComponent }
];
:
import { Routes, RouterModule } from '@angular/router';
import { CERTS_ROUTES } from './certs/certs.routes';
import { CertsComponent } from './certs/certs.component';
import { LoginComponent } from './login/login.component';
import { PageNotFoundComponent } from './page-not-found/page-not-found.component';
const APP_ROUTES: Routes = [
{ path: '', redirectTo: '/certs', pathMatch: 'full' },
{ path: 'login', component: LoginComponent },
{ path: 'certs', component: CertsComponent, children: CERTS_ROUTES },
{ path: '**', component: PageNotFoundComponent }
];
export const routing = RouterModule.forRoot(APP_ROUTES);
子供ルート(certs.routes.ts)以下のコードは "id"または "type"を返すが、未定義を返します。私はfirstChild
を取得した場合
import { Component, OnInit } from '@angular/core';
import { Subscription } from 'rxjs/Rx';
import { ActivatedRoute, Router } from '@angular/router';
@Component({
selector: 'app-cert-item',
templateUrl: './cert-item.component.html'
})
export class CertItemComponent implements OnInit {
private subscription: Subscription;
constructor(
private route: ActivatedRoute,
private router: Router
) { }
ngOnInit() {
this.subscription = this.route.params.subscribe(
(params: any) => {
let myId = params['id'];
let myType = params['type'];
console.log("ID: ", myId);
console.log("Type: ", myType);
}
);
}
}
私は正しい「ID」を取り戻すことができますが、「タイプ」の値が「ID」と同じです。 Iは(スニペット)を使用したコード:
ngOnInit() {
this.subscription = this.route.firstChild.params.subscribe(
(params) => {
this.catId = params['id'];
this.diffType = params['type'];
console.log("Id: ", this.catId);
console.log("Type: ", this.catId);
}
);
}
Iが正しい「タイプ」の値の正しい「ID」の値とthis.route.children["0"].url.value[1].path
を取り戻すことができthis.route.children["0"].url.value[0].path
を使用します。
コンソールでthis.route.children
を掘り下げて見つけましたが、正しくはないようですが、より良い/エレガントな方法がありますか?あなたは右のすべてをした
私は愚かなような気がします。気づいてくれてありがとう。この質問を削除しても構わないと思いますが、ちょうど恥ずかしいことです。 – ToDo
大したことではありません。すべてのプログラマーはこの種の間違いを何度も繰り返しました。それにかかわらず、もし私があなたを助けてくれたら、私の答えをアップしてください。 ;) –