Shruti Agarwal
Shruti Agarwal

Reputation: 897

How to trigger mdmenu on click of span or anchor tag in angular2

I have the following mdmenu in my Angular2 application :

<md-menu #appMenu="mdMenu">
 <button md-menu-item> Item1 </button>
 <button md-menu-item> Item2 </button>
 <button md-menu-item> Item3 </button>
</md-menu>

How can I trigger this on click of a span or an anchor tag ?

I am able to trigger it using md-button like this :

<button md-button [mdMenuTriggerFor]="appMenu">Menu</button>

I want to achieve the same functionality using span or anchor tag. PS : I cant use button inside span or anchor tag.

Upvotes: 1

Views: 1306

Answers (1)

Andriy
Andriy

Reputation: 15442

Try just to replace button with a (or span):

<a [mdMenuTriggerFor]="appMenu">Menu</a>
<md-menu #appMenu="mdMenu">
 <button md-menu-item> Item1 </button>
 <button md-menu-item> Item2 </button>
 <button md-menu-item> Item3 </button>
</md-menu>

you can style it with CSS as desired. plunker: https://plnkr.co/edit/YR9hTjActXL1Z79jXkH1?p=preview

Upvotes: 1

Related Questions