Rob Gravelle

As web developers may undoubtedly be aware, dates come in a wide assortment of formats, and even more still when you factor in local variations. There is no need to resort to third-party libraries to format dates in Angular, as the popular JavaScript framework provides the DatePipe for exactly that purpose. Not only does it […]

A short time ago, I wrote the Referencing DOM Elements using the Angular ViewChild Decorator tutorial. It covered the recommended way to access a single directive, child component, or DOM element from a parent component class in Angular applications. You could say that ViewChild is the Angular equivalent of the document.getElementByID() JavaScript selector. Angular also […]

Enums have long been a feature of the Java language, but were only added to TypeScript in recent years. Interestingly, enums are one of the few TypeScript features which is not a type-level extension of JavaScript. Their purpose is to define a set of named constants, making it easier to document intent, as well as […]

In the Respond to DOM Changes with Mutation Observers article, we learned about DOM Mutation Observers, which replaced the clunky DOM Mutation Events. Both Mutation Events and Mutation Observers were designed to inform your script of changes to the DOM structure. These include: the adding or removing of elements changes to an element’s attributes character […]

In Angular applications, when it comes to responding to changes in an element’s size, web developers have got a couple of choices: a) you can create a Resize Directive or b) you can use the ResizeObserver API. It provides a performant means to monitor an element for changes to its size, with notifications being delivered […]

Create a Nested Multi-select Tree with in Angular: Part 2 In this web development tutorial series, we are creating an alternative to the HTML SELECT control that is better suited for displaying hierarchical data. In the last installment, we learned about the different types of MatTrees in Angular and then configured a Nested Tree to […]

Part 1: Introducing the MatTree Traditional SELECT elements have long allowed multiple selections via the multiple attribute. The means for selecting multiple options can vary depending on the operating system and browser.   For example: For windows, users would hold down the control (Ctrl) button to select multiple options. For Mac, one would hold down […]

Build a Web Form with HTML: Part 8 Welcome to the eighth and final installment in this series on Web Forms. Unlike the previous seven parts, which focused on how to create and style common form controls, this tutorial will cover the third piece of the HTML development triad: JavaScript (the other two being HTML […]

Build a Web Form with HTML – Part 5 In this series on Web Forms, we’ve been learning how to create and style various form controls. The last installment covered how to style labels and buttons, as well as how to alter an element’s appearance based on user interactions. In today’s article, we’ll learn how […]

Part 4: CSS for Labels, Buttons and Form Interactions In the last installment of this series on Web Forms, we explored some of the most commonly employed CSS attributes to style form elements. Today’s article continues from where that one left off to cover how to style labels and buttons, as well as how to […]

Part 3: Styling Form Controls with CSS In this series on Web Forms, we’ve been learning how to use various form controls to collect data from your users. In the first and second installments we focused mainly with HTML, which determined the raw building blocks of the form. Today, we’ll be changing gears and turning […]

Part 2: Select, Radio/Checkbox, and Button Elements HTML forms have become ubiquitous as organizations try to connect with their customers. Therefore, it is imperative to learn about them for anyone learning how to build websites and/or web apps. In this short series on HTML Forms, we’re familiarizing ourselves with form controls by building one that […]