Angular : 루트로 수동 리다이렉트

Angular : 루트로 수동 리다이렉트

최근에 angular.js 1 대신 angular 4를 사용하기 시작했습니다.

angular 4의 기본을 배우기 위해 히어로즈 튜토리얼을 팔로우하여 현재 angular/router 패키지의 angular 자체 Router Module을 사용하고 있습니다.

어플리케이션의 인가를 실장하기 위해서 수동으로 다른 루트로 리다이렉트 하는 방법을 알고 싶습니다만, 인터넷에서는 이것에 관한 유익한 정보를 찾을 수 없는 것 같습니다.

각도 라우팅 : 수동 내비게이션

먼저 각도 라우터를 Import해야 합니다.

import {Router} from "@angular/router"

다음으로 컴포넌트 컨스트럭터에 주입합니다.

constructor(private router: Router) { }

그리고 마지막으로 전화한다.navigate필요한 곳이라면 어디서든 사용할 수 있습니다.

this.router.navigate(['/your-path'])

루트에 몇 가지 파라미터를 설정할 수도 있습니다.user/5:

this.router.navigate(['/user', 5])

문서:각 공식 문서

angularjs 4에서의 리다이렉트(예: app.home.html) 이벤트용 버튼

<input type="button" value="clear" (click)="onSubmit()"/>

그리고 집안에.contsent.ts

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

 @Component({
   selector: 'app-root',
   templateUrl: './app.home.html',
 })

 export class HomeComponant {
   title = 'Home';
   constructor(
     private router: Router,
    ) {}

  onSubmit() {
    this.router.navigate(['/doctor'])
 }
 }

다음과 같이 컨스트럭터에 라우터를 삽입해야 합니다.

constructor(private router: Router) { }

원하는 장소에서 할 수 있습니다.

this.router.navigate(['/product-list']);

각도 리다이렉트 수동:수입품@angular/router, 삽입constructor()그럼 전화해요this.router.navigate().

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

constructor(private router: Router) {
  ...
}

onSubmit() {
  ...
  this.router.navigate(['/profile']); 
}

이거면 될 것 같아

import { Router } from "@angular/router"

export class YourClass{

   constructor(private router: Router) { }

   YourFunction() {
      this.router.navigate(['/path']);
   }

}

component.ts 파일의 함수를 사용하여 다른 페이지로 수정합니다.

componentene.ts:

import {Router} from '@angular/router';
constructor(private router: Router) {}

OnClickFunction()
  {
    this.router.navigate(['/home']);
  }

component.component:

<div class="col-3">                  
<button (click)="OnClickFunction()" class="btn btn-secondary btn-custom mr-3">Button Name</button>
</div>

이것을 시험해 보세요.

constructor(  public router: Router,) {
  this.route.params.subscribe(params => this._onRouteGetParams(params));
}
this.router.navigate(['otherRoute']);

질문에 대한 정답은 충분할 수 있지만 IDE에서 경고가 표시되는 경우

탐색에서 반환된 약속은 무시됩니다.

이 경고를 무시하거나this.router.navigate(['/your-path']).then().

언급URL : https://stackoverflow.com/questions/47133610/angular-manual-redirect-to-route