Typescript try 将服务注入Angular组件时出错例外：无法解析组件的所有参数，为什么

我已经用Angular构建了一个基本的应用程序，但我遇到了一个奇怪的问题，我无法将服务注入到我的一个组件中.不过，它可以很好地注入我创建的其他三个组件中的任何一个.

首先，这就是服务:

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

@Injectable()
export class MobileService {
  screenWidth: number;
  screenHeight: number;

  constructor() {
    this.screenWidth = window.outerWidth;
    this.screenHeight = window.outerHeight;

    window.addEventListener("resize", this.onWindowResize.bind(this) )
  }
  
  onWindowResize(ev: Event) {
    var win = (ev.currentTarget as Window);
    this.screenWidth = win.outerWidth;
    this.screenHeight = win.outerHeight;
  }
  
}

以及拒绝使用的组件:

import { Component, } from '@angular/core';
import { NgClass } from '@angular/common';
import { ROUTER_DIRECTIVES } from '@angular/router';

import {MobileService} from '../';

@Component({
  moduleId: module.id,
  selector: 'pm-header',
  templateUrl: 'header.component.html',
  styleUrls: ['header.component.css'],
  directives: [ROUTER_DIRECTIVES, NgClass],
})
export class HeaderComponent {
  mobileNav: boolean = false;

  constructor(public ms: MobileService) {
    console.log(ms);
  }

}

我在浏览器控制台中遇到的错误如下:

异常:无法解析HeaderComponent:(？)的所有参数.

我在 bootstrap 功能中有服务，所以它有一个提供者.我似乎能够毫无问题地将它注入到我的任何其他组件的构造函数中.