css - Autocomplete-rullgardinsmenyn visar inte datan för mig

Jag använder en autokomplettering. När jag klickar på inmatningen öppnas en rullgardinsmeny med alla möjliga fält att välja.

Mitt problem är att fälten inte syns, jag har redan testat att använda z-index osv och hittills har ingenting fungerat.

Hur kan jag lösa detta?

DEMO

Kod

<div class="form-group" style="padding-top: 10px;">
    <div class="ng-autocomplete auto">
        <ng-autocomplete [data]="countries" [searchKeyword]="keyword" 
         [itemTemplate]="itemTemplate" [notFoundTemplate]="notFoundTemplate">
        </ng-autocomplete>

        <ng-template #itemTemplate let-item>
            <a [innerHTML]="item.departamento"></a>
        </ng-template>

        <ng-template #notFoundTemplate let-notFound>
            <div [innerHTML]="notFound"></div>
        </ng-template>
    </div>
</div>

Som du kan se på bilden finns informationen där, men den verkar inte synlig :(

Svar #1

I #itemTemplate behöver du binda name eftersom det är egenskapen i din json

Prova så här:

<ng-template #itemTemplate let-item>
    <a [innerHTML]="item.name"></a>
</ng-template>

Arbetsdemo