ngOnit не запускается

Question

У меня есть два компонента: TileComponent.ts и FullScreenComponent.ts.

При нажатии на TileComponent открывается FullScreenComponent.В TileComponent у меня есть следующий код.Метод ngOnInit () запускается всякий раз, когда загружается TileComponent.

TileComponent.ts:

ngOnInit() {
    console.log("TileCompnent :ngOnInit");        

    this.crossDomainService.globalSelectors.subscribe(selectors => {
      globalCountries = selectors.jurisdiction || [];
      this.getArticles(globalCountries);
    });

    // Multiple Language
    this.crossDomainService.globalLanguage.subscribe(() => {
      console.log("TileCompnent :ngOnInit : crossDomainService");
      this.getArticles(globalCountries || countries);
    });
  }

Теперь при закрытии FullScreenComponent приводит к загрузке TileComponent, но на этот раз я вижу, что метод ngOnInit () не получает

Может кто-нибудь помочь мне узнать причину, по которой это не работает?

tile.component.html:

<div class="carousel-inner">
      <a
        (click)="openFullScreen(article)"
        *ngFor="let article of articles"
        [ngClass]="getItemClassNames(article)"
        class="item"
      >
</div>

tile.component.ts

ngOnInit() {
    console.log("TileCompnent :ngOnInit");
    const countries =
      this.crossDomainService.initialGlobalSelectors &&
      this.crossDomainService.initialGlobalSelectors.jurisdiction.length
        ? this.crossDomainService.initialGlobalSelectors.jurisdiction
        : [];
    this.getArticles(countries);

    let globalCountries;

    this.crossDomainService.globalSelectors.subscribe(selectors => {
      globalCountries = selectors.jurisdiction || [];
      this.getArticles(globalCountries);
    });

    // Multiple Language
    this.crossDomainService.globalLanguage.subscribe(() => {
      console.log("TileCompnent :ngOnInit : crossDomainService");
      this.getArticles(globalCountries || countries);
    });
  }
    openFullScreen(article: ArticlePreview) {
        this.crossDomainService.openFullScreen(article);
      }

full-screen.component.html:

<div class="layout-center-wrapper" [hidden]="isPolicyShown">
  <app-header></app-header>

  <div class="row wrapper">
    <app-sidebar></app-sidebar>
    <router-outlet></router-outlet>
  </div>
</div>

<app-policy [hidden]="!isPolicyShown"></app-policy>

header.component.html:

<header class="row header">
  <p class="header__title">
    Application Name
    <a (click)="closeFullScreen()" class="header__close">
      <span class="icon icon_close"></span>
    </a>
  </p>
</header>

header.component.ts:

import { Component } from '@angular/core';
import { CrossDomainService } from '../../core';

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.less']
})
export class HeaderComponent {
  constructor(private crossDomainService: CrossDomainService, private analyticsService: AnalyticsService) {}

  closeFullScreen() {
    this.crossDomainService.closeFullScreen();    
  }
}

Answer 1

ngOnInit жизненный цикл запускается только при первом отображении представления компонента.

Поскольку старый Tile Component не разрушается и всегда находится в фоновом режиме, даже когда отображается FullScreenComponent, ловушка жизненного цикла никогда не срабатывает, даже когда вы закрываете компонент.(Я предполагаю, что вы не используете маршрутизатор для навигации, но используете его как всплывающее окно, поскольку есть кнопка закрытия, как показано в вопросе)

Не может помочь вам выделить проблему или помочь с предложениями, если вы неподелитесь кодомНо причина того, что ngOnInit не запускается в соответствии с этим вопросом, заключается в том, что компонент не создается заново.

Обновление: я до сих пор не могу понять, зачем вам нужно запускать ngOnInit?Если вы просто хотите выполнить код внутри, сделайте его отдельной функцией, скажем initSomething, затем вызовите его внутри ngOnInit, чтобы выполнить его в первый раз.Теперь, если вы просто вызовете эту функцию на crossDomainService.closeFullScreen, вы получите желаемый эффект.

Чтобы вызвать функцию при каждом вызове closeFullScreen, вы можете создать Subject в службе crossDomainService и подписаться на неепоместите его внутрь ngOnInit() и запускайте функцию initSomething, упомянутую выше, каждый раз, когда она выдает значение.Внутри функции closeFullScreen все, что вам теперь нужно сделать, это сделать Subject.next()

Прошу прощения за краткость, поскольку я не на своем рабочем месте и печатаю на мобильном телефоне, хотя для разработки кода должно быть достаточно поясненийпо своему усмотрению.