How to call custom service inside another services in angular 6

Question

How to call the custom service in another custom service in angular 6

I have created two service user.services.ts and counter.services.ts

Getting error : Cannot invoke an expression whose type lacks a call signature. Type 'Number' has no compatible call signatures

Even try to add service name in app.modules providers array but same error getting

user.services.ts

import { Injectable } from '@angular/core';
import { CounterService } from './counter.service';

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

activeUsers = ['Max', 'Anna'];
inactiveUsers = ['Chris', 'Manu'];

constructor(private counterSer: CounterService) { }

 setUserActive(id: number) {
  this.activeUsers.push(this.inactiveUsers[id]);
  this.inactiveUsers.splice(id, 1);
  this.counterSer.activeToInactiveCounter();
}

 setUserInactive(id: number) {
  this.inactiveUsers.push(this.activeUsers[id]);
  this.activeUsers.splice(id, 1);
 }
}

Counter.services.ts

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

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

 constructor() { }

 activeToInactiveCounter = 0;
 inactiveToActiveCounter = 0;

 incrementActiveToInactive() {
   this.activeToInactiveCounter++;
   console.log(this.activeToInactiveCounter);
 }

 incrementInactiveToActive() {
   this.inactiveToActiveCounter++;
   console.log(this.inactiveToActiveCounter);
 }
}

Answer 1

You are calling the property activeToInactiveCounter as a method. I think you are trying to call incrementActiveToInactive() .

So instead of: this.counterSer.activeToInactiveCounter(); in setUserActive , you should have: this.counterSer.incrementActiveToInactive();

setUserActive(id: number) {
    this.activeUsers.push(this.inactiveUsers[id]);
    this.inactiveUsers.splice(id, 1);
    this.counterSer.incrementActiveToInactive();
}