2017-12-26 5 views
0

각도 5 응용 프로그램에는 지정한 category의 제품을 반환하는 데이터 서비스가 있으며 페이지 매김이 있습니다. 매개 변수로 경로에 범주가 지정됩니다. 페이지 매김은 쿼리 매개 변수입니다. URL은 다음과 같습니다 : /category?page=2. 컴퍼넌트 queryParamsparamMap 모두에 가입되어경로 및 경로 매개 변수의 각도 구독

판 (카테고리 변수이다). 하나만 사용하면 괜찮습니다. '/ category? page = 2'에서 '/ anotherCategory'로 이동하면 데이터가 두 번 당겨집니다 (그리고 어떤 관찰 가능 데이터가 먼저 반환되는지에 따라 원치 않는 결과가 발생 함) . 이 경우에는 snapshot을 사용하면 작동하지 않습니다.

이 문제를 해결하는 방법에 대한 모범 사례를 찾을 수 없었습니다.

@Component({..}} 

constructor(private route: ActivatedRoute) {} 

ngOnInit() { 

    this.route.queryParams.subscribe((params: Params) => { 
     this.currentPage = params['page']; 
     this.getData(this.category, this.currentPage); 
    }); 

    this.route.paramMap.subscribe ((params: Params) => { 
     this.category = params.get('categoryName'); 
     this.getData(this.category, this.currentPage); 
    }); 
} 

참고 : 코드를 약간 수정 및 단순화를 위해 제거된다.

+0

paramsMap을 구할 때 어떤 일이 발생합니까? – Gary

+0

@ 게리, 그럼 난 그냥 categoryName가 아닌? page = 2 – Robert

+0

아, 요점이 있어요. – Gary

답변

0

의심의 여지는 매우 논리적이며 여기서는 스냅 샷이 동일한 경로의 param 변경 사항을 감지하지 않기 때문에 두 구독을 모두 사용해야합니다.

여기서 할 수있는 것은 getData 함수의 Activated 경로를 확인하는 것입니다. 따라서 데이터를 가져 오는 매개 변수가 우리 경로와 일치하지 않으면 간단히 반환 할 수 있습니다.

두 매개 변수가 활성화 된 경로와 일치 할 때만 데이터를 가져옵니다. 경로의 현재 매개 변수는 스냅 샷으로 검사 할 수 있습니다.

추가 설명이 필요한 경우 알려 주시기 바랍니다.

감사합니다.

관련 문제