Service to service injection Error in Angular 4

Asked Nov 23 '17 at 08:35

Active Nov 23 '17 at 14:12

Viewed 676 times

I'm having an error with ERROR TypeError: Cannot read property 'deleteData' of undefined. It seems that my service cannot use the functions of the other service I've injected.

this is my util.service.ts

import { Injectable } from '@angular/core';
@Injectable()
export class UtilService {
  deleteData() {
    localStorage.removeItem('token');
  }
}

this is my another service which is the auth.service.ts

import { Injectable } from '@angular/core';
import { UtilService } from "./util.service";

@Injectable()
export class AuthService {
  constructor (private util: UtilService) { }
  logout() { this.util.deleteData() }
}

this is the component where i've used the auth.service.ts

import { Component } from '@angular/core';
import { AuthService } from "../../services";
@Component({
  selector: 'app-header',
  template: require('./header.component.pug'),
  styles: [require('./header.component.scss')]
})
export class HeaderComponent {
  constructor(
    private router: Router,
    private auth: AuthService
  ) {}
  userLogout() { this.auth.logout();}
}

this is my error enter image description here

edited Nov 23 '17 at 08:45

asked Nov 23 '17 at 08:35

user8956707

when this method is triggered? on click of a button ? also add the module providers imports – Aravind Nov 23 '17 at 08:37
When a logout button is triggered – user8956707 Nov 23 '17 at 08:38
this is my app.module.ts https://pastebin.com/gJM95U6r – user8956707 Nov 23 '17 at 08:40
Is there any empty constructor in UtilService? – Danilo Dughetti Nov 23 '17 at 08:54
are both services being declared as providers on the same module as the HeaderComponent? – Eduardo Vargas Nov 23 '17 at 09:02
Yes. also on the main component – user8956707 Nov 23 '17 at 09:37

Service to service injection Error in Angular 4

0 Answers0