Как связать разные наборы данных с несколькими компонентами в Angular 7?

Question

Я создал пользовательский выпадающий компонент в Angular 7, который принимает массив в качестве входных данных. В настоящее время он используется для отображения списка стран. Это прекрасно работает, если этот выпадающий компонент появляется только один раз в родительском компоненте. Но теперь мне нужно использовать раскрывающийся компонент дважды в одном родительском компоненте - один для отображения списка стран, а другой для отображения состояний. Даже если я передаю разные наборы данных, он отображает только первый, который появляется в родительском компоненте. Мой вопрос: как бы я связал каждый раскрывающийся список с определенным набором данных?

Компонент раскрывающегося списка:

<input type="text" class="form-control" [(ngModel)]="selectedItem">
<div class="itemsContainer">
    <ul class="list">
        <li *ngFor="let item of listToFilter; let i = index;" class="item" id="{{'item-'+i}}">  
        {{item.value}} - {{item.description}}</li>
    </ul>
</div>

Родительский компонент:

<app-custom-dropdown [listToFilter]="countries" (itemSelected)="getSelectedCountry($event)"></app-custom-dropdown>