jqwidgets-scripts-custom/demos/Angular/dropdownbutton/defaultfunctionality/src/app/app.component.html

jQWidgets is an advanced jQuery, Angular 7, Vue, React, ASP .NET MVC, Custom Elements and HTML5 UI framework.

<jqxDropDownButton [theme]="'material'" #myDropDownButton style="float: left" 
    [width]="150" [height]="25">
    <jqxTree [theme]="'material'" #myTree 
        (onSelect)="treeOnSelect($event)" [width]="200">
        <ul>
            <li item-selected='true'>Home</li>
            <li item-expanded='true'>
                Solutions
                <ul>
                    <li>Education</li>
                    <li>Financial services</li>
                    <li>Government</li>
                    <li>Manufacturing</li>
                    <li>
                        Solutions
                        <ul>
                            <li>eLearning</li>
                            <li>Mobile</li>
                            <li>RIA</li>
                            <li>Training</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li>
                Products
                <ul>
                    <li>PC products</li>
                    <li>Mobile products</li>
                    <li>All products</li>
                </ul>
            </li>
        </ul>
    </jqxTree>
</jqxDropDownButton>

<div style="float: left; margin-top: 5px; margin-left: 30px">
    <jqxCheckBox [theme]="'material'" (onChange)="checkBoxOnChange($event)">
        Open On Mouse Over
    </jqxCheckBox>
</div>