通过在 URL 中插入参数在 angular 中路由

Question

假设我有一个路由在 localhost:4200/A 上的组件 A 当我在 A 之后传递参数时，我也想渲染 A，例如 localhost:4200/A/xyz 而无需单击任何按钮。

简单地说，如果我点击 URL localhost:4200/A/xyz 它应该在这里渲染组件 A xyz 是动态的，它可能正在改变。

Answer 1

您可以使用这样的参数添加路由定义：

{
        path: 'A/:id', component: AComponent
    },

然后在AComponent

import { ActivatedRoute } from '@angular/router';
@Component({
  selector: 'app-a',
  templateUrl: './a.component.html',
  styleUrls: ['./a.component.css']
})
export class AComponent{
  data: string;
  constructor(private activatedRoute: ActivatedRoute) {
     this.loadData();
  }

  loadData() {
    this.activatedRoute.paramMap.subscribe(params => {
      this.data= params.get('id');

    });
  }

通过在 URL 中插入参数在 angular 中路由

Routing in angular by insert parameter in URL

angular

angular-router