угловой роутер не активирует ngoninit - PullRequest
Новая
       10

угловой роутер не активирует ngoninit

0 голосов
/ 22 февраля 2019

У меня есть угловое приложение, которое предполагает создание графического интерфейса пользователя для входа в систему. У меня есть компонент входа со следующим HTML-кодом 

<mat-card>
  <mat-form-field class="full-width">
    <input matInput placeholder="Enter your Username" [(ngModel)]="username">
  </mat-form-field>

  <mat-form-field class="full-width">
    <input matInput placeholder="Enter Password" [(ngModel)]="password">
  </mat-form-field>

  <button mat-raised-button (click)="logIn()">Log In</button>
</mat-card>

Это код для компонента 

@Hub({hubName: 'DALHub'})
export class LogInComponent implements OnInit {
  private hubWrapper: HubWrapper;
  username: String = '';
  password: String = '';

  constructor(private router: Router, private hub: HubService) {
    // This is signalr init process
    this.hubWrapper = this.hub.register(this);
    this.hub.connect({url: 'http://localhost:10476/signalr'});
  }

  ngOnInit() {
  }

  logIn() {
    this.hubWrapper.invoke('LogIn', this.username, this.password);
  }

  @HubSubscription()
  LogOK() {
    this.hubWrapper.unregister();
    this.router.navigate(['logged', this.username, this.password]);
  }
}

Как вы можете видеть, я использую сервер-сигнализатор и пакет ngx-signalr для клиента.

как только пользователь нажимает кнопку «Войти», активируется функция входа в систему, которая вызываетсервер для проверки правильности имени пользователя и пароля.Если пароль и имя пользователя указаны правильно, сервер вызывает в клиенте функцию LogOK, которая предполагает маршрутизацию приложения на другой компонент.

Это конфигурация маршрутизатора 

const routes: Routes = [
  {path: '', component: LogInComponent},
  {path: 'logged/:username/:password', component: UserComponent}
];

(ПРИМЕЧАНИЕ.router-outlet находится на странице приложения html)

Это представление журнала log in component, когда я вхожу в систему, я ожидаю получить следующую страницу UserComponent Однако, когда я вхожу в систему, я получаю следующую страницу LogIn results Как вы можете видеть, страница входа все еще здесь, и страница пользователя выглядит странно, я проверил и увидел, что функция ngOnInit в UserComponent былане активируется, и я думаю, что это проблема.Вы знаете, как я могу это исправить?

Ответы [ 2 ]

0 голосов
/ 22 февраля 2019

Конфигурация маршрута 

const routes: Routes = [
  {path: '', component: LogInComponent},
  {path: 'logged/:username/:password', component: UserComponent}
];

Навигация / активация маршрута 

this.router.navigate(['/logged', this.username, this.password]);

Похоже, вам не хватает косой черты?Обратите внимание на косую черту в начале пути.

Из документов:

При построении элемента кризисного центра вы перешли к маршруту детализации кризиса, используя начальный абсолютный путьс косой чертой.

Маршрутизатор сопоставляет такие абсолютные пути с маршрутами, начиная с верхней части конфигурации маршрута.

Кроме того, вы можете включить трассировку маршрутов, чтобы лучше видетьчто может быть не так с вашими маршрутами: 

RouterModule.forRoot([routes], { enableTracing: true })
0 голосов
/ 22 февраля 2019

Похоже, что маршрут маршрутизации неверен, поэтому измените маршрут в login component следующим образом 

const url = `${'logged/' + this.username + '/' + this.password}`;
this.router.navigate([url]);
...