angular2テンプレートのリストから選択したリストアイテムを非表示にする方法は？

Question

選択して別のリストに追加したリストアイテムを非表示にしようとしていますが、追加するアイテムがリストに表示されないように適用するかどうかはわかりません。

Answer 1

<div class="countries-list"> 
    <span class="countries-list__header">{{'GeneralOrganizationalBackgroundSurveyComponent-STEP_6_ALL_LOCATIONS' | translate}}</span> 
    <ul> 
     <li *ngFor="let country of filteredCountries" 
      (click)="selectCountry(country, 'add')" 
      class="add" 
      [ngClass]="{'selectedCountry': selectedCountry?.name == country.name && selectedCountry?.action === 'add', 
         'disabledSelection': selectedCountry?.disabledSelection && selectedCountry?.name == country.name}"> 
      {{ country.name }} 
     </li> 
    </ul> 
</div> 
<div class="contries-controllers"> 
    <a class="btn-floating btn waves-effect waves-light cyan darken-3" 
     [ngClass]="{'disabled': selectedCountry === null || selectedCountry?.action === 'delete'}" 
     (click)="addCountryFromForm(selectedCountry.code)"> 
     <i class="material-icons">add</i> 
    </a> 
</div> 

例えば、*ngIf指令の正確なユースケースのように思える：

<li *ngIf='!selectedCountries.includes(country.code)'。