title: Angular 6 ngbTypeahead filter of list of JSON objects
body: <p>I've got a ngbTypeahead which when typing in the field should be able to query a list of objects.  The formate of the objects in the list &quot;projections&quot; is</p>
  <pre><code>{
      code: &quot;6326&quot;
      group: &quot;world&quot;
      name: &quot;WGS 1984&quot;
  }
  </code></pre>
  <p>HTML :</p>
  <pre><code>&lt;input id=&quot;typeahead-basic&quot; type=&quot;text&quot; class=&quot;form-control&quot; [(ngModel)]=&quot;item.outputProjection.name&quot; [ngbTypeahead]=&quot;search&quot; /&gt;
  </code></pre>
  <p>search filter code in component.ts class :</p>
  <pre><code>    search = (text$: Observable &lt; string &gt; ) =&gt;
      text$.pipe(
          debounceTime(200),
          distinctUntilChanged(),
          merge(this.focus$),
          map(term =&gt; (term === '' ? this.projections :
              this.projections.filter(v =&gt; v.name.toLowerCase().indexOf(term.toLowerCase()) &gt; -1)).slice(0, 10))
      )
  </code></pre>
  <p>When I type into the typeahead what I get is :</p>
  <p><a href="https://i.stack.imgur.com/oBcnn.png" rel="noreferrer"><img src="https://i.stack.imgur.com/oBcnn.png" alt="enter image description here" /></a></p>
  <p>But what I would like to show up is the name in the json object.....</p>
  <p>Also as a sidenote the folks at bootstrap closed this and said it's not a bug but a feature request:</p>
  <p><a href="https://github.com/valor-software/ngx-bootstrap/issues/749" rel="noreferrer">https://github.com/valor-software/ngx-bootstrap/issues/749</a></p>
  <p>Most modern UI Controls work with objects regardless of platform.</p>