使用angula2數據綁定的html屬性中的錯誤

Question

我需要一個帶有索引值的html屬性的＃號來觸發數據目標功能，我有索引值作爲每個項目的id，但沒有顯示＃如何顯示＃標識以觸發數據目標。

這裏是我的代碼

<span class="li-items" *ngFor="let item of menuData; let i = index;"> 
    <span class="dropdown-toggle single-item" data-toggle="collapse" [attr.data-target]="i" *ngIf="item.name == 'Events' "> 
     <a class="li-event">{{item.name}} ({{item.data.length}})<span class="b-caret"></span></a> 
    </span> 
    <span class="inner-block collapse" [attr.id]="i"> 
     <span></span> 
    </span> 
</span> 

我需要一個＃號，這裏

[attr.data-target]="i" 

這樣

[attr.data-target]="#i" 

Answer 1

使用函數來實現這一目標或插

<span class="dropdown-toggle single-item" data-toggle="collapse" [attr.data-target]="combineText(i)" *ngIf="item.name == 'Events' "> 

combineText(i){ 
    return '#' + i; 
} 

或者您可以使用插值

<span class="dropdown-toggle single-item" data-toggle="collapse" data-target="{{'#'.concat(i.toString())}}" *ngIf="item.name == 'Events' ">