Интерполировать переменную в класс с Angular

Question

Я хотел бы динамически генерировать имя класса для моего элемента.Например, <span class=``icon icon-${route.title}``></span> (здесь нужно было использовать двойные обратные кавычки, но на самом деле это должен быть только один набор обратных кавычек.)

    <ul class="sidebar-list">
      <li *ngFor="let route of menuRoutes.items">
        <span class=`icon icon-${route.title}`></span>
        <a routerLink="/{{route.path}}" routerLinkActive="active">{{ 'menu.' + route.title | translate}}</a> 
      </li>
    </ul>

Answer 1

Попробуйте это:

<span class="icon icon-{{route.title}}"></span>

Answer 2

Вы также можете архивировать это с помощью директивы [ngClass]

<span [ngClass]="['icon', route.title]"></span>