kfmc_website/src/app/Internal-Page/external-service-details/external-service-details.component.ts

import { ActivatedRoute, Params } from '@angular/router';
import { HttpClient } from '@angular/common/http';
import { AuthServiceService } from './../../shared/auth-service.service';
import { Component, OnInit } from '@angular/core';
import { NgxSpinnerService } from 'ngx-spinner';

@Component({
  selector: 'app-external-service-details',
  templateUrl: './external-service-details.component.html',
  styleUrls: ['./external-service-details.component.css']
})
export class ExternalServiceDetailsComponent implements OnInit {

  constructor(private route: ActivatedRoute,
    private authSer: AuthServiceService, 
    private spinner: NgxSpinnerService,
    private http: HttpClient) { }

  serviceId: number;
  serviceData = [];

  ngOnInit() {

    this.spinner.show();
    this.authSer.homeActivate = false;
    
    this.route.params.subscribe(
      (params:Params) => {
        this.serviceId = params['serviceId'];
      },
      (error) => {
        console.log(error);
      }
    );

    this.http.get(this.authSer.pathApi + '/get_external_service/' + this.serviceId).subscribe(
      (responce) => {
        console.log(responce);
        this.serviceData = responce['external_service'];
        this.spinner.hide();
      },
      (error) => {
        console.log(error);
      }
    );

  }

}