main-center.component.ts

import { Component, OnInit, OnDestroy } from '@angular/core';
import { TreeService } from 'src/app/services/tree.service';
import { Subscription } from 'rxjs';
import { TreeNode } from 'primeng/api';
import { ResourceService } from 'src/app/services/api/resource.service';
import { HttpErrorResponse } from '@angular/common/http';

@Component({
  selector: 'app-main-center',
  templateUrl: './main-center.component.html',
  styleUrls: ['./main-center.component.css']
})
export class MainCenterComponent implements OnInit, OnDestroy {

  private treeSubscription: Subscription;
  currentNode: TreeNode;

  constructor(
    private treeService: TreeService,
    private resourceService: ResourceService
  ) { }

  ngOnInit() {
    this.treeSubscription = this.treeService.node$.subscribe(async (node) => {
      if (node == null) {
        return;
      }
      console.log('Selected node is', node);
      this.currentNode = node;
      const data = node.data as { pdfName: string };
      try {
        console.log('I will load', data.pdfName);
        const pdfData = await this.resourceService.getResourcePDF(data.pdfName);
        // render pdf to screen

      } catch (err) {
        console.log(err);
        if ((err as HttpErrorResponse).status === 404) {
          // handle not found
        }
      }

    });
  }

  ngOnDestroy() {
    this.treeSubscription.unsubscribe();
  }
}