угловое предложение поиска 2/4, не отображаемое в текстовом поле

Я разрабатываю раскрывающееся окно поиска предложений в угловом 2/4.

Что я сделал до сих пор:

При вводе текста в текстовое поле и нажатии кнопки поиска отображаются искомые данные.

Чего я хочу достичь:

Я хочу показать, что поиск, a€?as-you-typea€™предложение хотят отображаться (как выпадающий поиск).

Я попробовал другие похожие вопросы, но ответы не работают на меня.

Я установил угловой материал и получил некоторые ошибки в своих пакетах.

Я хочу что-то вроде этого

Я попытался с трубой, но это не сработало.

Html

<div class="form-group">
    <div class="input-group">
        <div [innerHTML]="highlighted"></div>
        <input name="search" class="form-control" type="text" placeholder="Search" (keyup)="FetchItemDetailsSearch(searchcontent)" [(ngModel)]="searchcontent">                       
        <span class="input-group-btn">
            <button class="btn btn-success ProductSearchBtn" type="button" 
                (click)='FetchItemDetailsSearch(searchcontent)'>
                <i class="glyphicon glyphicon-search" aria-hidden="true"></i>
                <span style="margin-left:10px;">Search</span>
            </button>
        </span>
    </div>                  
</div>

component.ts

FetchItemDetailsSearch(itemcodeordesc: string): void {

    this.pageIndex = 1;
    this.searchflag = 1;

    if (itemcodeordesc.length > 0)
        this.searchcontent = itemcodeordesc;
    else {
        itemcodeordesc = undefined
        this.searchcontent = itemcodeordesc;
    }
    this.prevScrollPosition = 0;

    this._enqService.FetchItemDetailsSearch(this.searchcontent, this.pageIndex).subscribe(itemsData => this.itemdetails = itemsData,
        error => {
            console.error(error);
            this.statusMessage = "Problem with the service.Please try again after sometime";
        });
}

Я получил это (это проблема, не показывающая предложения)

Я попробовал методы, которые можно получить в Интернете, но ни один из них не дает желаемого результата.

Это мой пакет .json

"dependencies": {
    "@angular/common": "~4.3.4",
    "@angular/compiler": "~4.3.4",
    "@angular/core": "~4.3.4",
    "@angular/forms": "~4.3.4",
    "@angular/http": "~4.3.4",
    "@angular/platform-browser": "~4.3.4",
    "@angular/platform-browser-dynamic": "~4.3.4",
    "@angular/router": "~4.3.4",
    "angular-in-memory-web-api": "~0.3.0",
    "bootstrap": "^3.3.7",
    "core-js": "^2.4.1",
    "jquery": "^3.2.1",
    "rxjs": "5.0.1",
    "systemjs": "0.19.40",
    "zone.js": "^0.8.4"

Я также стараюсь , как это , но это не сработало.