Implementing autocomplete
<p>I am having trouble finding a good autocomplete component for Angular2. Just anything that I can pass a list of key-label objects to and have a nice autocomplete on an <code>input</code> field.</p>

<p>Kendo does not support Angular 2 yet and that it what we mostly use internally.  It doesn't appear that Angular Material supports Angular 2 yet either.</p>

<p>Can anyone please point me in the right direction or let me know what they are using?</p>

<p>This is what I built so far.  It's pretty bad and I'd like to find something that looks nice.</p>

<pre class="lang-ts prettyprint-override"><code>import {Component, EventEmitter, Input, Output} from 'angular2/core';
import {Control} from 'angular2/common';
import {Observable} from 'rxjs/Observable';
import {SimpleKeyValue} from '../models/simple-key-value'
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';

@Component({
selector: 'general-typeahead',
template: ` &lt;div&gt;
            &lt;div class="input-group"&gt;
            &lt;input type="text" [ngFormControl] = "term" class="form-control" placeholder={{placeHolder}} &gt;
            &lt;/div&gt;
            &lt;ul&gt;
                &lt;li class="item" *ngFor="#item of matchingItems" (click)="selectItem(item)"&gt;
                    {{item.value}}
                &lt;/li&gt;
            &lt;/ul&gt;              
&lt;/div&gt;`
})

export class GeneralTypeahead {

  matchingItems: Array&lt;SimpleKeyValue&gt;;
  term = new Control();

  @Input() allItems: Array&lt;SimpleKeyValue&gt;;
  @Input() placeHolder: string;
  @Output() onSelectItem = new EventEmitter&lt;SimpleKeyValue&gt;();

  constructor() {
    this.term.valueChanges
        .distinctUntilChanged()
        .debounceTime(200)
        .subscribe((term : string) =&gt; this.matchingItems = this.allItems.filter(sl =&gt; sl.value.toLowerCase().indexOf(term.toLowerCase()) &gt; -1));
  }

  selectItem(sl: SimpleKeyValue) {
    this.onSelectItem.emit(sl);
  }
}
</code></pre>