Угловой 2 Назначение динамического класса для элемента

Question

Я довольно новичок в Angular 2, и я хочу присвоить класс HTML-Element. Он должен быть динамическим -> Если у другого элемента (с идентификатором) есть атрибут, этот элемент должен стать классом.

Here's мой код, я попробовал:

<div class="panel panel-default" ngFor="let date of epgDates; let i = index"> 
    <div class="panel-heading" role="tab"> 
     <h4 class="panel-title"> 
      <a #aEle role="button" data-toggle="collapse" id="a-{{i}}" href="#{{i}}" aria-expanded="true"> 
       <span class="glyphicon" [class.glyphicon-minus]="aEle.getAttribute('aria-expanded')==='true'" 
        aria-hidden="true"> 
       </span> {{date | date: 'dd.MM.yyyy'}} 
      </a> 
     </h4> 
    </div> 
</div> 

С помощью этого кода я получаю сообщение об ошибке ...:/ Может кто-то помочь мне здесь?

Большое спасибо!

Answer 1

Вы не можете использовать [] и {{}} вместе. Либо один или другой, но не оба

Это устанавливает класс, когда "true" это выражение, которое возвращает true в противном случае класс удаляется

[class.glyphicon-minus]="true" 

Это устанавливает класс glyphicon-minus, когда выражение true возвращает true в противном случае класс удаляется и устанавливает или удаляет класс #a-1.aria-expanded при возврате второго выражения true (при условии, что i - 1). Имя класса может быть строкой ('glyphicon-minus') или выражение ('#a-' + i + '.aria-expanded')

[ngClass]="{'glyphicon-minus': true, '#a-' + i + '.aria-expanded': true}" 

выражение true и быть буквальным логическое значение (как показано) или имя свойства класса компонента, или более сложное выражение с операторами и вызовы функций.

обновление

<a #aEle role="button" data-toggle="collapse" id="a-{{i}}" href="#{{i}}" aria-expanded="true"> 
    <span class="glyphicon" [class.glyphicon-minus]="aEle.getAttribute('aria-expanded')==='true'" aria-hidden="true"></span> 
    {{date | date: 'dd.MM.yyyy'}} 
</a> 

Я добавил атрибут #aEle шаблон для <a> и использовать его, чтобы получить значение в aria-expanded атрибута.