Question

我有一个Angular 7组件，在其中我获得了路线参数值：

export class PostComponent implements OnInit {

  postId: number;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {

    console.log(this.postId);

    this.route.paramMap.subscribe(parameters => {
      this.postId = +parameters.get('postId');
    })

    console.log(this.postId);

  }

}

在第一个控制台日志postId中未按预期定义。

在第二个控制台日志上，postId为0，因为在URL中找不到postId。

如果URL中未找到postId，我希望postId保持不确定状态。

我该怎么办？

Answer 1

您可以执行以下操作：

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-post-detail',
  templateUrl: './post-detail.component.html',
  styleUrls: ['./post-detail.component.css']
})
export class PostDetailComponent implements OnInit {

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.route.params.subscribe(params => {
      const postId = params['postId'];
      const postIdToUse = postId ? +postId : undefined;
      console.log('Got the PostId as :' , postIdToUse);
    });
  }

}

这是您推荐的Working Sample StackBlitz。

用route参数定义变量。但是，如果找不到参数，请保持未定义状态

1 个答案: