[英]How to check the condition for data-target?
是否有可能以更優化的方式編寫如下代碼:
<li [ngClass]="sidebarVisible ? 'nav-item' : 'nav-item sidebar-false-new-folder'"
*ngIf="sidebarVisible">
<a (click)='this.createNewDirectory()' data-toggle="collapse" data-target="#navbarToggler"
aria-controls="navbarTogglerDemo02" aria-expanded="false"
aria-label="Toggle navigation"><i
class="nc-icon nc-simple-add"></i>New Folder</a>
</li>
<li [ngClass]="sidebarVisible ? 'nav-item' : 'nav-item sidebar-false-new-folder'"
*ngIf="!sidebarVisible">
<a (click)='this.createNewDirectory();' data-toggle="collapse"
aria-controls="navbarTogglerDemo02" aria-expanded="false"
aria-label="Toggle navigation"><i
class="nc-icon nc-simple-add"></i>New Folder</a>
</li>
唯一不同的部分是data-target="#navbarToggler"
。 我嘗試過這樣的事情:
<li [ngClass]="sidebarVisible ? 'nav-item' : 'nav-item sidebar-false-new-folder'">
<a (click)='this.createNewDirectory()' data-toggle="collapse"
data-target="{{ sidebarVisible ? '#navbarToggler' : '' }}"
aria-controls="navbarTogglerDemo02" aria-expanded="false"
aria-label="Toggle navigation"><i
class="nc-icon nc-simple-add"></i>New Folder</a>
</li>
不幸的是,它不起作用。 有什么建議么?
你有沒有嘗試過 :
<li [ngClass]="sidebarVisible ? 'nav-item' : 'nav-item sidebar-false-new-folder'">
<a (click)='this.createNewDirectory()' data-toggle="collapse" [attr.data-target]="sidebarVisible ? '#navbarToggler' : '' "
aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation"><i
class="nc-icon nc-simple-add"></i>New Folder</a>
</li>
為什么不使用ng-bootstrap崩潰 ?
<p>
<button type="button" class="btn btn-outline-primary" (click)="isCollapsed = !isCollapsed"
[attr.aria-expanded]="!isCollapsed" aria-controls="collapseExample">
Toggle
</button>
</p>
<div id="collapseExample" [ngbCollapse]="isCollapsed">
<div class="card">
<div class="card-body">
You can collapse this card by clicking Toggle
</div>
</div>
</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.