data-holding-service-JavaScript

c1.component.ts

import { Component, OnInit } from '@angular/core';

import {DataHolderService} from '../../core/services/data-holder-service/data-holder-service.service';

@Component({
  selector: 'app-c1',
  templateUrl: './c1.component.html',
  styleUrls: ['./c1.component.scss']
})
export class C1Component implements OnInit {

  constructor(
    private dataHolder: DataHolderService
  ) { }

  ngOnInit() {
  }
  
  // sending data to service for holding
  feedDataToService(item) {
  	const data = {
      id: item.id
      FirstName: item.FirstName,
      LastName: item.LastName,
      ProfileTitle: item.ProfileTitle,
      AdditionDes: item.AdditionDes,
    }
    this.dataHolder.getData(data);
  }

}

c2.component.ts

import { Component, OnInit } from '@angular/core';

import {DataHolderService} from '../../core/services/data-holder-service/data-holder-service.service';

@Component({
  selector: 'app-c2',
  templateUrl: './c2.component.html',
  styleUrls: ['./c2.component.scss']
})
export class C2Component implements OnInit {

  constructor(
    private dataHolder: DataHolderService
  ) { }

  ngOnInit() {
  }
  
  // getting data from DataHolderService in this component
  getDataFromService() {
  	const data = this.dataHolder.setData();
    console.log(data);
  }

}

data-holder-service.service

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class DataHolderService {

  constructor() { }

  data: any;

  getData(data){
    this.data = {
      id: data.id,
      FirstName: data.FirstName,
      LastName: data.LastName,
      ProfileTitle: data.ProfileTitle,
    }
  }

  setData() {
    return this.data;
  }

}