Angular2 + MaterialDesignLite：添加HTML屬性動態

我與Angular2和MaterialDesignLite工作，要實現就像這一個菜單：Angular2 + MaterialDesignLite：添加HTML屬性動態

<ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" 
    for="demo-menu-lower-left"> 
    <li class="mdl-menu__item">Some Action</li> 
    <li class="mdl-menu__item mdl-menu__item--full-bleed-divider">Another Action</li> 
    <li disabled class="mdl-menu__item">Disabled Action</li> 
    <li class="mdl-menu__item">Yet Another Action</li> 
</ul>

讓我們專注於殘疾人財產。我希望它在我想禁用菜單項時仍然出現，仍然可見。這是我到目前爲止已經取得的成就：

<div class="mdl-menu__container-menu"> 
    <div class="mdl-menu__outline mdl-menu--bottom-right"></div> 
    <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" [attr.for]="id"> 
     <li [attr.disabled]="item.disabled" *ngFor="#item of items" class="mdl-menu__item" (click)="onClick($event, item.id)">{{item.text}}</li> 
    </ul> 
</div>

不幸的是，MDL <li>禁用屬性不與一個布爾值工作（禁用=「true」或禁用=「假」行爲就像禁用本身）和已禁用不是<li>的本地屬性，Angular2不允許我將它設置爲[disabled]="item.disabled"。

有什麼辦法可以設置禁用屬性本身，在特定的條件下，通過使用指令？

有什麼辦法可以有條件地設置一個屬性（沒有任何賦值）或指令在一個組件動態？

在此先感謝您的幫助！

來源

2016-04-15 Vítor Teixeira

我還沒有找到一種方式來獲得

<li disabled

但添加刪除作品與

<li [attr.disabled]="item.disabled ? true : null"

導致

<li disabled="true"

或

<li

來源

2016-04-15 10:38:11

謝謝，這解決了我的問題！我試圖通過使用指令'* disabled =「condition」'並直接在nativeElement上設置** disabled **屬性來實現它。不幸的是，因爲它在模板區域內（for循環），所以不起作用。 –

Angular2 + MaterialDesignLite：添加HTML屬性動態

回答

相關問題