Saya mendapatkan error ini sementara melaksanakan runtuhnya fitur:
Kesalahan: Template parse error: Bisa't mengikat 'target' sejak itu isn't diketahui milik '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>
Tetapi jika saya hanya menggunakan data-target="#demo"
, yang bekerja dengan baik. Tapi ketika saya mengikat {{RowIndex}}
dari yang menunjukkan kesalahan.
Anda melewatkan properti mengikat
<button data-toggle="collapse"
[attr.data-target]="'#demo'+ RowIndex">Toggle
</button>
<button (click)="clickMe($event)">Toggle</button>
clickMe(value){
value.srcElement.innerHTML="Clicked";
}
Menggunakan sudut's atribut sintaks mengikat.
Gunakan salah satu dari berikut:
<button data-toggle="collapse"
attr.data-target="#demo{{RowIndex}}">Toggle
</button>
atau
<button data-toggle="collapse"
[attr.data-target]="'#demo' + RowIndex">Toggle
</button>
Anda dapat menggunakan href tag bukan dari div. anda dapat memeriksa kode di bawah ini
<div class="card" *ngFor="let service of servicesArr;let i = index">
<a data-toggle="collapse" href="#{{i}}{{service.name}}">{{service.label}}</a>
<div id="{{i}}{{service.name}}" class="collapse">
Lorem ipsum dolor text....
</div>
</div>