title: How to get values with Directive & ngModel with Angular 4
body: <p>I've created one directive in angular 2 which is initialising summernote text editor which is working fine but I am not able to get its value it always returns undefined with ngModel</p>
  
  <p><strong>Directive Code :</strong></p>
  
  <pre><code>import { Directive, ElementRef, Input, Output, EventEmitter } from '@angular/core';
  
  declare var $: any;
  
  @Directive({ selector: '[summernote]' })
  
  export class summernoteDirective {
  
      @Input() config;
  
      element:any;
  
      constructor(el: ElementRef) {
          this.element = el.nativeElement;
      }
  
      ngOnInit()
      {
          $(this.element).summernote(this.config);
      }
  }
  </code></pre>
  
  <p><strong>Component Code HTML :</strong></p>
  
  <pre><code>&lt;input type="text" name="PostTitle" [(ngModel)]="PostTitle" 
         class="form-control" placeholder="Post title"&gt;
  &lt;textarea name="PostContent" [(ngModel)]="PostContent" 
         summernote [config]="options"&gt;&lt;/textarea&gt;
  &lt;button (click)="submitPost(PostTitle,PostContent);" 
          class="btn btn-primary" data-toggle="dropdown"&gt;Post&lt;/button&gt;
  </code></pre>
  
  <p><strong>Component ts Code :</strong></p>
  
  <pre><code>submitPost(PostTitle,PostContent)
  {
      console.log(PostTitle);
      console.log(PostContent);
  }
  </code></pre>
  
  <p>2nd console <em>PostContent</em> always returns undefined is there any way to get values on button click with directive</p>