[2020] Ionic - How To Add Angular Service In 4 Simple Steps

How to create a service in Ionic/Angular

Step 1:

Create a new employee Service:

ionic generate service  employee

Now that the new service has been created add the following method side the export class EmployeeService

employe.service.ts

getEmployees(){
    return [
        {"id": 1, "name": "John", "age": 29}
    ];
}

Step 2:

Register the injector in app.module.ts

ADD: import { EmployeeService } from './employee.service';

ADD in providers : []: EmployeeService

Step 3:

Declare dependencies in your component. In this example, lets say we have an employee.component.ts file

ADD: import { EmployeeService } from '../employee.service';

ADD: public employees = [];

ADD in constructor:
constructor(private _employeeService: EmployeeService){}

// GET THE DATA FROM THE EmployeeService
ngOnInit(){
    this.employees = this._employeeService.getEmployees(); // Gets data from exmployee.service.ts
}

Step 4:

Open employee.component.html

<pre>{{employees |json}}</pre>

 This video shows all these step in more details inchase you are interested, This guy does a very good job in explaning it further.