Не может привязываться к "цели", так как это не известное свойство "div"

Я получаю эту ошибку при реализации функции свернуть:

Ошибка: ошибки разбора шаблона: невозможно привязать к "цели", поскольку это не известное свойство 'div'

app.component.html:

<div *ngFor = "let ele of elements; let RowIndex = index">
    {{ele.name}} 
    <button data-toggle="collapse" 
            data-target="#demo{{RowIndex}}">Toggle
    </button>
    <div id="demo{{RowIndex}}" class="collapse">Lorem Ipsum</div>

</div>

Но если я просто использую data-target="#demo", это работает нормально. Но когда я привязываю {{RowIndex}}, чем его отображающую ошибку.

Ответ 1

Вы пропустили привязку свойств

<button data-toggle="collapse" 
        [attr.data-target]="'#demo'+ RowIndex">Toggle
</button>


<button (click)="clickMe($event)">Toggle</button>

clickMe(value){
    value.srcElement.innerHTML="Clicked";

  }

Ответ 2

Используйте синтаксис связывания атрибутов angular.

Используйте одно из следующих действий:

<button data-toggle="collapse" 
        attr.data-target="#demo{{RowIndex}}">Toggle
</button>

или

<button data-toggle="collapse" 
        [attr.data-target]="'#demo' + RowIndex">Toggle
</button>