Вызовите компонент приложения ngOnInit () второй раз при нажатии на ссылку

Question

Я реструктурирую проект angular, в котором я обнаружил следующие функциональные возможности.

В файле app.component.ts

ngOnInit() {
this.portfolioID = Number(sessionStorage.getItem('portfolioID'));
console.log(this.portfolioID);
this.sharedService.getPortfilioID().subscribe(portfolioID => {
  if (portfolioID && portfolioID !== 0) {
    this.items.forEach(item => {
      if (item.displayText === 'Business Licenses' && item.items.length > 0) {
        item.items.forEach(childItem => {
          childItem.url = childItem.defaultUrl;
        });
      }
    });
  }
});
}

Они получают некоторый идентификатор из localalstorage, который был установлен нажав на ссылку в другом компоненте.

Another.component. html

<ng-template kendoGridCellTemplate let-dataItem *ngIf="column.isActionable && titleName == 'Customer Search'">
    <a href="javascript:void(0)" *ngIf="column.attributeName == 'portfolioName'"
      (click)="viewPortfolioDetails(dataItem.portfolioID)">{{dataItem.portfolioName}}</a>
  </ng-template>

Another.component.ts

viewPortfolioDetails(portfolioID: number) {
sessionStorage.setItem('portfolioID', portfolioID.toString());
this.sharedService.setPortfolioID(portfolioID);
}

Итак, как было установлено при нажатии, изначально, когда страница загружается в первый раз до щелчка, я не могу получить идентификатор, и последующая функциональность не работает. Итак, мой вопрос, могу ли я снова вызвать метод onInit () app.component? Или есть ли лучший подход для этого? Спасибо.

Answer 1

Вам не нужно звонить на ngOnInit() дважды. Переменная childItem.url будет установлена ​​в компоненте приложения до тех пор, пока portfolioID s правильно передаются к наблюдаемой в общей службе. Вы можете попробовать следующее в службе

Общая служба

import { Subject } from 'rxjs';

@Injectable()
export class SharedService {
  private portfolioIdSource = new Subject<number>();
  private portfolioId$ = this.portfolioIdSource.asObservable();

  public setPortfolioID(portfolioID: number) {
    this.portfolioIdSource.next(portfolioID);
  }

  public getPortfilioID(): Observable<number> {
    return this.portfolioId$;
  }
}

, а также убедиться, что значение, полученное из хранилища сеансов, используется в начале жизненного цикла приложения.

Компонент приложения

subscription: any;

ngOnInit() {
  const portfolioID = sessionStorage.getItem('portfolioID');    // <-- will be called only once at the beginning of app life-cycle
  if (portfolioID !== null && Number(portfolioID) !== 0) {
    this.setUrl();
  }

  this.subscription = this.sharedService.getPortfilioID().subscribe(    // <-- will be triggered everytime new portfolioID is pushed
    portfolioID => {
      if (portfolioID && portfolioID !== 0) {           // <-- will not be called at app beginning because no value in observable 
        this.setUrl();
      }
    }
  );
}

setUrl() {
  this.items.forEach(item => {
    if (item.displayText === 'Business Licenses' && item.items.length > 0) {
      item.items.forEach(childItem => {
        childItem.url = childItem.defaultUrl;
      });
    }
  });
}

ngOnDestroy() {
  if (this.subscription) {
    this.subscription.unsubscribe();
  }
}

Answer 2

Пожалуйста, используйте следующую ссылку Javascript - указание setInterval запускать только x раз?

Здесь Вы можете написать содержимое вашей oninit(), используя setintervalX()

Таким образом, вы можете вызывать содержимое oninit несколько раз