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

У меня есть приложение angular, которое предполагает создание графического интерфейса пользователя для входа в систему. У меня есть компонент входа в систему со следующим 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}
]; 

(ПРИМЕЧАНИЕ, роутер-выход находится на html-странице приложения)

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


person Yedidya kfir    schedule 22.02.2019    source источник
comment
у вас есть вызов функции LogOK ()   -  person Sivaramakrishnan    schedule 22.02.2019
comment
Да, я пробовал это, и когда я сам вызываю эту функцию (из самого компонента, а не с сервера), она работает, но я не знаю, почему   -  person Yedidya kfir    schedule 22.02.2019
comment
Я не использовал 'ngx-signalr', но я бы подумал, что это может быть область действия функции ... попробуйте сделать console.log ('HubSubscription', this) в своей функции LogOK, чтобы проверить область   -  person Daniel Delgado    schedule 22.02.2019
comment
Пробовал и это, когда я распечатал область с помощью console.log (this), и я увидел его logInCoponent   -  person Yedidya kfir    schedule 22.02.2019
comment
есть ли шанс this.hubWrapper.unregister(); вмешиваться?   -  person noobed    schedule 22.02.2019
comment
Нет, это ничего не изменило   -  person Yedidya kfir    schedule 22.02.2019
comment
@Yedidyakfir - это это вышеупомянутый пакет npm?   -  person noobed    schedule 22.02.2019
comment
Нет, это   -  person Yedidya kfir    schedule 22.02.2019
comment
Кого-нибудь еще немного смущает передача пароля по URL-адресу?   -  person DeborahK    schedule 22.02.2019


Ответы (2)


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

const url = `${'logged/' + this.username + '/' + this.password}`;
this.router.navigate([url]);
person Sivaramakrishnan    schedule 22.02.2019
comment
Я пробовал это, и он не сказал, также имейте в виду, что я вижу, что маршрутизатор перешел по правильному пути (это URL-адрес браузера), но он все еще не активировал функцию ngoninit - person Yedidya kfir; 22.02.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 })
person DeborahK    schedule 22.02.2019
comment
Ты уверен? когда я попытался добавить косую черту, у меня возникла ошибка недопустимой конфигурации. Я также попытался включить трассировку, но не увидел ничего необычного. - person Yedidya kfir; 23.02.2019
comment
Да, я уверен ... но я поместил это не в то место в моем примере. :-(. Извините. Сейчас исправлю. - person DeborahK; 23.02.2019
comment
Это не помогло, я использую как файлы css, так и файлы scss, может ли это быть источником проблемы? - person Yedidya kfir; 24.02.2019