Angular2:当路径参数改变时调用方法/ ngoninit

时间:2016-12-23 11:38:51

标签: angular typescript ngoninit

现在我正在制作一种网上商店,在我的主页上我有一个类别的下拉列表示父母猫A和子猫B和C.

Cat A,B和C均由1个组件CatAComponent表示。当我第一次进入其中一只猫时,我的ngoninit被调用,页面显示它需要显示的内容。

当我想点击另一个子猫时,我仍然在同一个组件上,但只有一个路径的参数更改(例如我在localhost:123 / CatA / CatB,现在我在localhost: 123 / CatA / CatC,只更改了一个参数,因此不会调用ngOnInit,也不会调用我的更新方法。

有什么方法可以解决这个问题?我不能在我的视图文件中放置(单击)方法来引用该方法,类别的菜单在另一个viewcomponent中。

只有参数更改后才可以调用NgOnInit吗?

1 个答案:

答案 0 :(得分:18)

您必须按以下方式订阅ActivatedRoute服务:

//元器件

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

export class YourComponent {
  constructor(
    private route: ActivatedRoute      
  ) {}

  ngOnInit(): void {
    this.route.params.subscribe((params: Params) => {
      console.log(params); 
      // this will be called every time route changes
      // so you can perform your functionality here

    });
  }
}