The Dropdown Component requires two descendant elements with the following classes:
This Component does not have any inputs
Parameter Name | Description | Required |
---|---|---|
toggled | Emits true when the dropdown is opened and false when it is closed. | False |
<sme-dropdown>
<button role="button" class="sme-dropdown-toggle">
<span >Menu</span>
<span class="sme-icon sme-icon-chevronDown"></span>
</button>
<ul role="menu" class="sme-dropdown-content">
<li>
<a>Item 1</a>
</li>
<li>
<a>Item 2</a>
</li>
</ul>
</sme-dropdown>
<sme-dropdown>
<button role="button" class="sme-dropdown-toggle">
<span>Dropdown</span>
<span class="sme-icon sme-icon-chevronDown"></span>
</button>
<ul role="menu" class="sme-dropdown-content" style="width:300px">
<sme-data-table class="sme-dropdown-interaction-enabled" [items]="data">
<sme-data-table-column field="name" header="Name" [sortable]="true">
</sme-data-table-column>
<sme-data-table-column field="value" header=" value" [sortable]="true">
</sme-data-table-column>
</sme-data-table>
</div>
</sme-dropdown>