title: Associating ngx-timepicker-field with input
body: <p>I want to associate input with ngx-timepicker-field from <a href="https://www.npmjs.com/package/ngx-material-timepicker" rel="nofollow noreferrer">https://www.npmjs.com/package/ngx-material-timepicker</a>. It work's when I use ngx-material-timepicker like this:</p>
  
  <pre><code>&lt;input
   matInput
   [ngxTimepicker]="picker"
   [format]="24"
  /&gt;
  &lt;ngx-material-timepicker #picker&gt;&lt;/ngx-material-timepicker&gt;
  </code></pre>
  
  <p>but when i only change</p>
  
  <pre><code>&lt;ngx-material-timepicker #picker&gt;&lt;/ngx-material-timepicker&gt;
  </code></pre>
  
  <p>into</p>
  
  <pre><code>&lt;ngx-timepicker-field #picker&gt;&lt;/ngx-timepicker-field&gt;
  </code></pre>
  
  <p>I get errors:</p>
  
  <pre><code>SingularActionDesignComponent.html:13 ERROR TypeError: this._timepicker.registerInput is not a function
      at TimepickerDirective.registerTimepicker (ngx-material-timepicker.js:764)
      at TimepickerDirective.set timepicker [as timepicker] (ngx-material-timepicker.js:699)
      at updateProp (core.js:32189)
      at checkAndUpdateDirectiveInline (core.js:31871)
      at checkAndUpdateNodeInline (core.js:44367)
      at checkAndUpdateNode (core.js:44306)
      at debugCheckAndUpdateNode (core.js:45328)
      at debugCheckDirectivesFn (core.js:45271)
      at Object.eval [as updateDirectives] (SingularActionDesignComponent.html:34)
      at Object.debugUpdateDirectives [as updateDirectives] (core.js:45259)
  </code></pre>
  
  <p>eventually is there any other good non-bootstrap library for timepicking?</p>