ActivatedRoute в Angular 5 не доставляет параметры URL. Идеи?

Question

Я реализовал ActivatedRoute на своей странице app.component.ts. Это страница, на которой у меня есть большая красная кнопка выхода, и она отображается на всех страницах моего приложения, как и предполагалось.

Я прыгаю в созданный мной URL-адрес (со строкой запроса) следующим образом:

http://localhost:4200/status?returnString=xyz

у меня есть private route: ActivatedRoute в моем конструкторе. В моем ngOnInit() у меня есть функция console.log(this.route.queryParams);, И это возвращает объект, где ._value это объект со свойством returnString: "xyz" как предполагалось.

Проблема в том, когда я console.log(this.route.queryParams.returnString) или же console.log(this.route.queryParams._value) Мне обслуживают объект без свойств. {},

У меня вопрос, что случилось или более того, что я делаю не так? Что мне потребуется, чтобы получить параметр из URL, который я могу использовать в Angular 5?

Answer 1

Ваша проблема связана с тем, что queryParams является Observable,

В вашем ngOnInit() Функция, которую нужно подписать на наблюдаемую:

ngOnInit() {
    this.route. queryParams.subscribe(
      params => {//Do something with the params.returnString},
      err => console.log(err)
);
}

Официальные угловые документы - ActivatedRoute

Answer 2

queryParams является Observable, поэтому вы должны слушать изменения, а не проверять значение.

Когда app.component инициируется, значение еще не установлено, но когда вы его проверяете, оно есть. Это, вероятно, то, что вы испытываете.

Настройте слушателя и реагируйте на изменения

route.queryParams.subscribe((params: Params) => this.doSomething(params.returnString))