Angular 2：路由参数发生变化，重新加载同一页面？

我有一个参数的路由，当去页/用户/ 123其中123是参数ngOnInit被调用，我得到我的参数，我打电话给我的方法来获取用户。Angular 2：路由参数发生变化，重新加载同一页面？

但是，当我在该页面上，然后单击第二个链接/ users/456时，不再调用ngOnInit（因为该页面已经实例化）。因此，如果没有ngOnInit，我无法获取路由参数，也无法调用我的方法来获取用户。

如果我去/ users/123，然后到/ home，然后到/ users/456，它显然工作。

我必须使用什么来确保获取参数并获取用户的函数始终被调用，即使我已经在同一页上？

2016-12-30 Brecht Baekelandt

您可以使用用户route.params听帕拉姆的更改。

import { ActivatedRoute } from '@angular/router'; 

export class DemoPage { 
    constructor(private _route: ActivatedRoute) { } 
    ngOnInit() { 
      this._route.params.forEach(params => { 
        let userId = params["userId"]; 
        //call your function, like getUserInfo() 
      }) 
    } 
}

来源

2016-12-30 08:43:04

OnInit仅在实例化指令时被调用一次。

对于手表路径参数使用ActivatedRoute。

constructor(private route: ActivatedRoute) { } 

ngOnInit(): void { 
    this.route.params.forEach((params: Params) => { 
     console.log(params); // Your params called every change 
    }); 
}

不要忘了导入：

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

了解更多的OnInit：OnInit - ts - API

了解更多关于ActivatedRoute：ActivatedRoute - ts - API

来源

2016-12-30 08:38:06 Jarek

好的抱歉，家伙，我打电话给我的get用户以外的activatedRoute回调。

这是正确的：

import { ActivatedRoute } from '@angular/router'; 

export class DemoPage { 
constructor(private _route: ActivatedRoute) { } 
ngOnInit() { 
     this._route.params.forEach(params => { 
       let userId = params["userId"]; 
       getUserInfo(userId); 
     }); 
    } 
}

我所做的是：

import { ActivatedRoute } from '@angular/router'; 

export class DemoPage { 
constructor(private _route: ActivatedRoute) { } 
ngOnInit() { 
     var userId = ""; 
     this._route.params.forEach(params => { 
      userId = params["userId"];                     
     }); 

     getUserInfo(userId) 
    } 
}

来源

2016-12-30 08:53:21

params为可观察到的。所以你只需要订阅一次观察数据，每次参数改变，你都会收到通知。

constructor(private route: ActivatedRoute) {} 

ngOnInit() { 
    this.route.params 
    .switchMap((params: Params) => /* load your user e.g. getUser(params['id']) */) 
    .subscribe(user => this.user = user); 
}

您还需要导入ActivatedRoute而params

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

来源

2016-12-30 08:59:34 DGD

Angular 2：路由参数发生变化，重新加载同一页面？

回答

相关问题