programing

Angular 2: URL을 변경하지 않은 라우팅

elecom 2023. 8. 26. 10:29
반응형

Angular 2: URL을 변경하지 않은 라우팅

URL을 변경하지 않고 Angular 2 앱에서 경로를 지정하려면 어떻게 해야 합니까? (이는 앱이 장고 앱 페이지의 여러 탭 중 하나 아래에 위치하고 URL을 변경하지 않는 것이 적합하기 때문입니다.)

현재 저는 안에 이것과 같은 것이 있습니다.app.component.ts

@RouteConfig([
  {
    path: '/home',
    name: 'Home',
    component: HomeComponent,
    useAsDefault: true
  },
  {
    path: '/user/:id',
    name: 'UserDetail',
    component: UserDetailComponent
  }
])

그리고 속으로는HomeComponent사용자 페이지로 이동하려면 다음을 사용합니다.

this._router.navigate(['UserDetail', {id: id}]);

그러면 URL은 다음과 같이 보일 것입니다.http://localhost:8000/django_url/user/123

Angular 2 앱 내에서 탐색할 때 URL을 변경할 수 있습니까? 그래야 URL이 유지됩니다.http://localhost:8000/django_url사용자가 페이지에 있을 때user/123?

감사합니다!

갱신하다

router.navigateByUrl("/team/33/user/11", { skipLocationChange: true });
<a [routerLink]="..." skipLocationChange>click me</a>

갱신하다

를 직접 지원하는 PR이 있습니다. https://github.com/angular/angular/pull/9608

관련 이슈

원래의

사용자 정의를 구현할 수 있습니다.PlatformLocation브라우저 플랫폼 위치와 비슷하지만 ot를 호출하는 대신history.pushState(),history.replaceState(),history.back(),그리고.history.forward()로컬 배열의 변경 사항을 유지합니다.

그런 다음 Angular가 다음과 같이 사용자 정의 구현을 사용하도록 할 수 있습니다.

bootstrap(AppComponent, 
    [provide(PlatformLocation, {useClass: MyPlatformLocation})]);

마지막으로 Angular2 최종 릴리즈에서 작동합니다.경로로 이동하는 동안 {skipLocationChange: true}을(를) 통과해야 합니다.

 this.router.navigateByUrl('path', { skipLocationChange: true });

this.router.navigateByUrl('path', { skipLocationChange: true });저를 위해서도 일했습니다.

RoutesArray 아래와 같이 구성 요소를 로드하는 경로도 추가했습니다.

const appRoutes: Routes = [    
   { path: 'Account/MySchool', component: MySchoolComponent }
];

그리고 거기에 있는 파일에서 구성 요소를 교체하고 초기화해야 합니다.router아래와 같은 물건과 필요한 장소에 전화하세요.

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

constructor(private router: Router) {    }


onSubmit() {        
    this._requestService.postPageOneData("Account/SavePageOneData", this.userProfile)
        .subscribe((response) => {
            if(response.status == 'success'){
                   this.router.navigateByUrl('Account/PageTwoSelection', { skipLocationChange: true });
              }
        }, this.handleErrorSubscribed );
    }

언급URL : https://stackoverflow.com/questions/37054731/angular-2-routing-without-changing-url

반응형