Угловая операция 2 GET

Question

Мой заголовок имеет форму поиска. Всякий раз, когда эта форма представляется, я перенаправлять на другой URL, как так:

private onSubmit(){ 
    var url = './search/' + this.searchForm.get("query").value; 
    this.router.navigate([url]); 
    } 

Сейчас я нахожусь на странице результатов поиска, и все работает отлично. Но если я снова использую форму поиска в заголовке на странице результатов поиска, ничего не меняется. Мне пришлось изменить код, в котором результаты поиска загружаются из ngOnInit в ngDoCheck.

ngDoCheck() 
    { 
    var query; 

    this.route.params.forEach(params => 
    { 
     query = params['query']; 
    }); 

    this.items = this.itemService.searchItems(query); 
    } 

Моя цель просто иметь форму поиска в верхней части моего сайта, который отвезет меня на странице результатов и показать мне результаты. Так же, как и любая старая форма GET и некоторый код на стороне сервера. Что было бы разумным способом достижения этого в Angular 2?

Answer 1

Кажется, что вы должны использовать наблюдаемый, чтобы прослушивать изменения в serachbar, использовать некоторые наблюдаемые для прослушивания chnages в строке поиска, которые срабатывают при нажатии кнопки или в записи или что угодно.

import { Observable } from 'rxjs/Rx'; 
import * as Rx from 'rxjs/Rx'; 
import 'rxjs/add/observable/of'; 
import 'rxjs/Rx'; 
import 'rxjs/add/operator/map' 
..... 


AbcObs: Rx.Subject<any> = new Rx.Subject<any>(); 
ABC: number = 0; 


In your file where you want to show results 
this.base_path_Service.ABcObs.subscribe(res => { 
    // LISTEN TO CHANGES HERE AND FIRE SOME METHOD/EVENT AS PER REQUIREMENT 
    // here `base_path_Service` is some global service for the app 
    this.onSubmit() 
} 

Answer 2

В маршрутах есть много вещей, в которые входит. Один из них - посмотреть, на каком пути вы находитесь.

Что бы я сделал в вашей ситуации, это проверить «текущий маршрут». Если вы не находитесь на «маршруте поиска» (/ search /), перейдите на эту страницу с данными поиска (как вы сейчас делаете). Создайте переменную, в которой хранятся данные поиска.

Если вы уже находитесь на странице поиска, вам не следует переходить на «маршрут поиска», вы должны только в submit обновить переменную, созданную вами ранее, с помощью новых данных поиска. Если эта переменная привязана к данным, все должно обновляться автоматически.

псевдокод:

private onSubmit(){ 
    if(/* NOT ON SEARCH-ROUTE */){ 
     var url = './search/' + this.searchForm.get("query").value; 
     this.router.navigate([url]); 
    }else{ 
     /* Update the variable on the search-page that holds the search-data */ 
    } 
    } 

Я надеюсь, что это какая-либо помощь.