如何从angular2模板中的列表中隐藏选定的列表项？

Question

我想隐藏选中的列表项并将其添加到另一个列表，但不知道要应用什么，因此添加的项不会显示在列表中。

<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> 

Answer 1

看起来像一个确切的用例为*ngIf指令，例如：

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