라우터 getCurrentNavigation은 항상 null을 반환합니다.

라우터 getCurrentNavigation은 항상 null을 반환합니다.

Angular 7.2.6의 최신 버전에서는 라우터 자체에 데이터를 전달하려고 합니다.

this.router.navigate(['other'], {state: {someData: 'qwert'}}

에서OtherComponent파일,this.router.getCurrentNavigation()항상 null을 반환합니다.

스택블리츠 링크

Angular Docs - 현재 탐색 가져오기

Angular Docs - 상태

당신은 그 방법을 부르고 있습니다.getCurrentNavigation늦었군요.탐색이 완료되었습니다.

당신은 전화가 필요합니다.getCurrentNavigation생성자 내부의 메서드:

constructor(private router: Router) {
    this.name = this.router.getCurrentNavigation().extras.state.someData;
}

또는 에서 탐색에 액세스하려는 경우ngOnInit다음을 수행할 수 있습니다.

ngOnInit() {
    this.name = history.state.someData;
}

Angular 16 이후, v15에서 도입된 브레이킹 변화를 대체할 것입니다.getCurrentNavigation돌아올지도 모르는null.

---

16번 이전 답변:

Angular 15 이후로,this.router.getCurrentNavigation()구성 요소가 탐색 후 인스턴스화되므로 null을 반환할 수 있습니다.

대안은 다음에서 상태에 액세스하는 것입니다.Location(에서 온 것)@angular/common)

  import { Location } from '@angular/common';

  constructor(private location: Location) {
    location.getState() // do what you want 
  }

코드를 이렇게 바꾸는 이유는 다음과 같습니다.constructor()오직 그ngOnInit()호출되어 값이 null이 됩니다.

constructor(private router: Router) {
   this.name = this.router.getCurrentNavigation().extras.state.example;
}

이는 현재 상태의 getCurrentNavigation().extras().state를 사용하기 전에 NavigationEnd 이벤트에 약속(비동기 프로세스)이 있었기 때문에 발생했습니다.

나는 그 후에 약속을 옮겼습니다. 그리고 voila!먼저 치료하지 않고 데이터를 얻을 수 있었습니다.

경로가 매개 변수에 등록된 경우:

{path: 'somePath/:id', component: SomeComponent}

올바르게 탐색하는 것이 중요합니다.

this.router.navigate(['/some', id], {state: {data: id}});

올바르지 않은 경우:

this.router.navigate(['/some'+'/'+id], {state: {data: id}});

Angular는 잘못된 사용에 대해 경고하지 않으며 this.router.getCurrentNavigation().extras.state가 설정되지 않았습니다.

Angular 16 이후로, 다음이 있습니다.lastSuccessfulNavigationv15에 도입된 파괴적인 변화를 대체하기 위해.getCurrentNavigation돌아올지도 모르는null.

규격(검정)의 경우,getCurrentNavigation()에constructor일하지 마세요, 당신은 그것을 사용해야 합니다.history에ngOnInit()그리고 가짜 가치들.history예:

beforeEach(() => {
    window.history.pushState({name: 'MyName', id: 1}, '', '');
}

이제 구성 요소에서 이 값을 사용할 수 있습니다.ngOnInit() 및 사양에 사용:

ngOnInit(): void {
    console.log(history.state.name);
}

상태를 유지하려면 navigateByUrl을 사용합니다.

this.route.navigateByUrl('/your-route', { state: { id:some_id, name:'your_data' } );
<a [routerLink]="['dynamic']" [state]="{ { id:some_id, name:'your_data' }}">Dynamic Data</a>

나를 위해 일하는 아이오닉 4.

• this.syslog.url => /app/syslog/etc// 현재 위치

언급URL : https://stackoverflow.com/questions/54891110/router-getcurrentnavigation-always-returns-null