Skip to content

Latest commit

 

History

History
23 lines (19 loc) · 994 Bytes

README.md

File metadata and controls

23 lines (19 loc) · 994 Bytes

Dropdown directive in Angular 12

Live URL

https://piyalidas10.github.io/dropdown-directive/

Dropdown directive with keyboard functionalities

1. CLick on outside the dropdown and press TAB from keyboard
2. focus will shift on dropdown
3. press ENTER key from keyboard - dropdown open
4. Press down arrow and up arrow to change the selected option and you can see the selected text will be changed
5. also can select using mouse

Four ways of listening to DOM events in Angular

https://medium.com/claritydesignsystem/four-ways-of-listening-to-dom-events-in-angular-part-1-event-binding-3ec7e9f51a1d

1. Event Binding: One-way data binding, in which information is sent from a component’s template to the component’s class
2. @HostListener: Angular decorator that handles events on the host element
3. Renderer2: Using Renderer2 .listen() method for a target event and element
4. RxJS: Using RxJS .fromEvent() operator that turns events into observable sequences