DEV Community

loading...
Cover image for Adding Angular Reactive Form Web Components to your static site
CodingCatDev

Adding Angular Reactive Form Web Components to your static site

ajonp profile image Alex Patterson Originally published at ajonp.com on ・1 min read

Shoutout to Alligator.io for all the help on this one!

Adding dynamic features to a static site.

This is a multi part series covering all the different types of Web Components I am using on the https://ajonp.com site currently. I just wanted to show how you can use each of them at a somewhat high level.

I was inspired to share more by Max's post:

Fully Functioning Angular Reactive Form in Web Component

This is SUPER simple, it sets the default value in the form to Alex, we will take this further in another part of the series to include more validations.

Console output for example

This shows the formGroup values with displayName: 'Alex' as expected.

Alt Text

Issue with using ion-input

Logged an issue (which had me banging my head for 24 hours) with Ionic repo.

The BEST Part

Now we can package up a simple example as an NPM package (or GitHub package) and utilize it in other apps.

Let me know what you think!

Discussion (0)

pic
Editor guide