Software Engineering

Build a Custom Autocomplete-Search Angular App With a Dynamic Table

Play with CSS overlay and Angular Material components

Photo by Scott Graham on Unsplash

Because the challenges we’re facing will never end.

And because, as programmers, we’ll never stop learning and improving.

Because web development is a creative art and a game — one in which we can play with the rules.

Because of these reasons, today we’ll implement a customizable autocomplete that renders a dynamic table in its overlay, and we’ll export it as an Angular library, as shown in the following video:

• The number, type, and names of the columns are communicated as inputs to the dynamic table
• The component hosting the custom autocomplete gives the data list for the table. This list could be static or dynamic (an Observable).
• The user can select an option from the displayed options list with a mouse click or by navigating with the keyboard’s arrows and pressing…