как написать условие в интерполяции вместо * ngIf

Question

Я использую 2 языка в своем приложении, поэтому я написал его в теге 2 <option>. Как я могу записать эти оба условия в один тег <option> с помощью интерполяции?

<option *ngIf="this.language=='en' || category.odiyaName==null" [value]="category.id">
  {{category.name}}
</option>
<option *ngIf="this.language=='or' && category.odiyaName" [value]="category.id">
  {{category.odiyaName}}
</option>

Answer 1

Вы также можете использовать условие при интерполяции. Посмотрите на «круглые скобки», заключенные в условие, и на то, что использование this в этом языке необязательно. Я также использовал «безопасный» оператор, чтобы проверить, является ли значение odiyaName null, и оператор «!». -else, если category.odyaName - "" передаст ваше условие

<option [value]="category.id">
    {{(language=='en' || !category?.odiyaName)
              ?category.name
              :category.odiyaName}}
</option>

Answer 2

Вы можете использовать блок if else для отображения опции.

<option [value]="category.id">
  <ng-container *ngIf="this.language=='en' || category.odiyaName==null; else elseBlock">
    {{category.name}}
  </ng-container>
  <ng-template #elseBlock>
    <ng-container *ngIf="this.language=='or' && category.odiyaName">
      {{category.odiyaName}}
    </ng-container>
  </ng-template>
</option>

Answer 3

В основном напишите свой logi c для компонента и передайте ему шаблон, чтобы упростить Html.

<option [value]="category.id"> {{checkLanguage(category)}} </option>

Файл компонента (.ts):

 checkLanguage(category){ 
  if(this.language==='en' || !category.odiyaName){
    return category.name
  }else if(this.language=='or' && category.odiyaName){
    return category.odiyaName;
 }
}