Почему директива angular * ngIF не работает со значением Dynami c?

Question

У меня есть компонент с некоторым блоком, который я хочу показать только на какой-то странице, для этого я использую директиву angular ngIf и подписываюсь на изменение маршрутизатора, где я получаю текущий URL. Я не понимаю, почему это не работает. Вот код:

ts.file

Переменная, которую я использую showSignUpBlock

 public showSignUpBlock = false;

  constructor(
    private userService: UserService,
    private router: Router,
    private localeService: LocaleService,
    private soliticsService: SoliticsService,
    private pushWooshService: PushWooshService,
    private loaderService: LoaderService,
    private gtmService: GtmService,
    private routingService: RoutingService
  ) {
    this.subscribeToIsLoadingUpdates();
  }

  ngOnDestroy(): void {}


  setShowBasicLayout(url: string): void {
    const pagesWithSignUpBlock = ['education/academy/login'];
    this.showSignUpBlock = pagesWithSignUpBlock.includes(url);
  }

  ngOnInit(): void {
    this.routingService
      .subscribeToRouterEvents()
      .subscribe((event: RouterEvent) => {
        const currentPath = event.url.substring(1);
        this.setShowBasicLayout(currentPath);
        console.log(this.showSignUpBlock);
      });
  }

html .file

Заблокировать то, что мне нужно показать или скрыть и ngIf, если не работает вот этот * ngIf = "showSignUpBlock"

  <div class="login-form-signup" *ngIf="showSignUpBlock"> {{ 'login.sign-up' | translate:lang }}
    <span class="login-form-signup-link" (click)="navigateToRegistrationPage()">{{'login.click-here'| translate:lang}}!</span>
  </div>

Я был бы очень благодарен, если бы кто-то объяснил, как это исправить.

Answer 1

Попробуйте использовать ChangeDetectorRef # detectChanges после установки переменной showSignUpBlock. Это заставляет angular обновить представление.