data-hover angular2不起作用

不能綁定到「數據懸停」，因爲它不是「跨度」

我已經試過跨度的已知屬性，分區沒有運氣。現有頁面在很大程度上依賴於數據懸停，因此重寫不是一種選擇。

<a class="main-item" routerLink='{{ item?.url}}'> 
    <span class="main-item-hover" data-hover="{{item?.label}}">{{item?.label}}</span> 
</a>

這段代碼工作完全沒有角

編輯：

.main-item-hover:before { 
    content: attr(data-hover); 
    font-weight: 600; 
    position: absolute; 
    top: 100%; 
}

這是數據懸停是如何在CSS使用。

想法？

來源

2017-07-16 Branko Ilic

您是否在尋找'標題='？ –

嘗試重寫代碼中使用方括號以產權爲

<a class="main-item" [routerLink]="item?.url"> 
    <span class="main-item-hover" [attr.data-hover]="item?.label"> 
    {{ item?.label }} 
    </span> 
</a>

plunker結合一起：https://plnkr.co/edit/v49Qe7FInPToKXf952Et?p=preview

來源

2017-07-16 16:56:05 Andriy

這是我在發佈之前嘗試的第一件事，同樣的事情[ERROR - >] [data-hover] =「item？.label」> {{item？.label}} –

應該添加'attr'屬性綁定，我更新了我的原始答案，並添加了稍微不同的CSS的plunker，只是爲了顯示CSS'內容' – Andriy

我完全忘記了attr。部分。我仍然不確定何時需要attr，何時不需要。哦，非常感謝很多 –

data-hover angular2不起作用

回答

相關問題