title: Angular 2 - Error: No provider for FormControl
body: <p>I writing a library for the community, which needs access to the form control and listens on the value changed.</p>
  
  <p>Here's how I did previously when using angular 2.3 and 4.0.</p>
  
  <pre class="lang-js prettyprint-override"><code>export class ValidationMessageDirective implements OnInit {
  
      @Input('validationMessage') customMessage: string;
      constructor(private el: ElementRef, private formControl: NgControl, private validationMessageService: ValidationMessageService) {
          this.target = $(el.nativeElement);
          this.formGroup = this.target.closest('.form-group');
  
          this.formControl.valueChanges.subscribe((newValue) =&gt; {
              this.checkValidation();
          });
      }
  }
  </code></pre>
  
  <p>But this code is not working anymore after upgrade to angular 4.1.
  Here's the error that I get:
  <code>ERROR Error: Uncaught (in promise): Error: No provider for NgControl!</code></p>
  
  <p>Any suggestion or idea for me to listen on the value changed in the directive?</p>
  
  <p><strong>UPDATE 1:</strong>
  here's my <code>index.ts</code></p>
  
  <pre class="lang-js prettyprint-override"><code>import { NgModule, ModuleWithProviders } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { FormsModule, ReactiveFormsModule } from '@angular/forms';
  import { ValidationMessageDirective } from './src/ng2-validation-message.directive';
  import { ValidationMessageService } from './src/ng2-validation-message.service';
  
  export * from './src/ng2-validation-message.directive';
  export * from './src/ng2-validation-message.service';
  
  @NgModule({
      imports: [
          CommonModule,
          FormsModule,
          ReactiveFormsModule
      ],
      declarations: [
          ValidationMessageDirective
      ],
      exports: [
          ValidationMessageDirective
      ],
  })
  export class Ng2ValidationMessage {
      static forRoot(): ModuleWithProviders {
          return {
              ngModule: Ng2ValidationMessage,
              providers: [ValidationMessageService]
          };
      }
  }
  </code></pre>