title: What is the best way to share service-using-typescript function that live across components?
body: <p>I've got a few TypeScript functions that are used across components. 
  They currently live in their own components (which means those functions are repeated across unnecessarily).</p>
  
  <p>Given the fact that these functions do use services ( such as httpClient ), what would be the best course of action so we can bring them into one centralized location and have all of those components tap into them with 0 dups?  </p>
  
  <p>Here is what I have done to make it a service based solution</p>
  
  <pre><code>1. ng g s javascript-library
  
  2. goto app.module.ts and import it
  
  3. import { JavascriptLibraryService } from './services/javascript-library.service';
  
  4. add it to the providers array in the app.module.ts as well.
    providers: [
      JavascriptLibraryService
    ],
  
  5. add this code into  services/javascript-library.service.ts 
  
  import { Injectable } from '@angular/core';
  
  @Injectable()
  export class JavascriptLibraryService {
  
    constructor() { }
  
    blp_test(input) {
      return 'Hello from Library Service';
    }
  
  }
  
  
  6. goto the component where I want to use it and and import and do dependency injection
  ( this is my-component.ts )
  
  6a. import { JavascriptLibraryService } from './../../services/javascript-library.service';
  
  6b dependency injection
  constructor(
        private javascriptLibraryService: JavascriptLibraryService,
        ) {
    }
  
  
  7. and finally, as the final step, try to access the function! 
  
  ngOnInit(): void {
  
      blp_test(); // dead on arrival
  
  }  
  </code></pre>