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
'programing' 카테고리의 다른 글
| Mac에서 Android SDK 찾기 및 PATH에 추가 (0) | 2023.08.26 |
|---|---|
| 마지막 알 수 없는 ID로 레코드 그룹 가져오기 (0) | 2023.08.26 |
| 데이터베이스:위치 데이터를 쿼리하는 최상의 성능 방법은 무엇입니까? (0) | 2023.08.26 |
| org.java.kafka.common.카프카 예외:카프카 소비 장치를 구성하지 못했습니다. (0) | 2023.08.26 |
| 보기 또는 임시 테이블 - MS SQL Server에서 사용할 테이블을 선택합니다. (0) | 2023.08.26 |