Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Major architecture changes coming

See original GitHub issue

Hello 👋

What’s this all about?

I’d like to share a little update on ngx-sub-form on behalf of @zakhenry and myself as we’ve been pretty quiet for a while. We’ve had some work at CloudNC we needed to focus on and with the Covid-19 coming in between, we’ve all had to adapt. So if you’ve commented on an issue, made a PR or made any kind of interaction and haven’t had any answer don’t take it badly. We still care a lot about ngx-sub-form and we’ll try to get back to you asap 😸.

Better inclusion of ngx-sub-form into our planning (at CloudNC)

@zakhenry and I have been trying to build a dependency graph of all the issues, order and prioritize them in order to start including some of them as part of our work time (during our sprints 🙌). We hope to tackle some tech debt on ngx-sub-form pretty soon 💪.

New architecture

I spent a whole day thinking about all the issues, how they connect to each others, how to solve one without adding unwanted behavior, etc. The following lead me to think that we need to rework on the architecture of the project and make major changes.

From what I’ve found, concepts will remain the sames but:

  • Internal of the lib will be (nearly) fully rewritten to be more flexible and hopefully simpler ✨
  • Public API would also have some changes but more like moving things around rather than the need to rewrite all your forms from the ground up! 😸


Let’s start with a rough diagram of the new internal data flow. Please don’t focus too much on this yet, I’ll refer to it point by point explaining what’s new and what it’ll bring:

the image has a good quality, if it’s not big enough open it in its own tab


Creating a sub/remap/root form component

First big change: Lets get rid of inheritance 👍.

Here’s how a basic sub form would look like with the new API:

  // all the usual
export class SubFormComponent {
  public subForm: SubForm = createSubForm<YourSubFormType>(this, {
    formControls: {
      prop1: new FormControl(),
      prop2: new FormControl(),

Related issue:

Stop using internally { emitEvent: false } every time we interact with the public form group

Internally the biggest issue we face is how to apply changes to our form group when required by the parent (through writeValue or even setDisabledState for example) without broadcasting those values straight up to the parent.

When the value of the model changes upstream, we want to put it into the form group, wait for the user to update the form, and for every subsequent changes broadcast the value up. In order to achieve this, we previously used { emitEvent: false }:

This way, the changes would be reflected on the form but our internal subscription to formGroup.valueChanges wouldn’t be triggered straight away when writeValue is called.

Unfortunately, this led to some (annoying) issues:

How is the upgrade going to work?

We’ll try to make the upgrade as smooth as possible by deprecating the old way of using ngx-sub-form through classes and expose the new functions once they’re ready. This should let you do an incremental update if you’ve got a lot of components using ngx-sub-form. (and don’t worry, we have ~120 components which extends Ngx*FormComponent so we’ll have to go through that ourselves 😅!)

We’ll create a next branch were we’ll be able to make pre-releases on CI so that we can thoroughly test internally that everything is fine before publishing it for good 👍 and ask for some help from the community to see if everything is fine for everyone!

The first target will be to reach features parity. Once we reach that objective we should be able to cut a release (a feature release, not a breaking change 👌). From there, already quite a few issues should be solved and we should be able to move on to new issues.

How can you help?

  • You’ve been using ngx-sub-form in your project(s)?
    (Please let us know here 😸)

  • You have ideas that we should take into account during the rewrite?

  • You’re keen to help for review once the PR is out?

  • Have anything interesting to share?

Please comment directly on this issue so that we can all end up with a good way of working with our forms 😃!

Following is just the Excalidraw backup for the schema

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:13
  • Comments:38 (17 by maintainers)

github_iconTop GitHub Comments

maxime1992commented, Nov 21, 2021

Good evening everyone 👋

Looks like after a year and a half… We’re finally merging this 🎉

Feel free to give us some feedback how the new API is working out for you. Hope you enjoy the bug fixes and the switch from inheritance to a function createForm (see updated README!) 😸.

Thanks to everyone who participated in this thread to give feedback and ideas 👏 and a big thanks for all your patience as well 🙏!

maxime1992commented, Nov 18, 2021

@Waterstraal I’ve raised a MR to add support for Angular 13 and avoid the ngcc step for ngx-sub-form 😃

Note: This MR targets the feat-rewrite branch (the one published on the beta channel).

Read more comments on GitHub >

github_iconTop Results From Across the Web

How Architecture Has Changed in the Past Two Decades
One of the biggest changes in architecture is coming up with greener design solutions – the notion also known as going green. That...
Read more >
6 Interesting Reasons Why Architecture Changes Over Time
From how buildings are used, to environmental changes, to historical impacts, there are many reasons why architecture changes over time.
Read more >
8 Tech Advancements Changing Architecture | Designblendz
8 Major Technology Advancements Altering Architecture · 1. Building Information Modeling (BIM) · 2. Animations and Renderings · 4. Artificial Intelligence (AI) ·...
Read more >
5 Trends That Could Shape the Future of Architecture
Architecture is often influenced by current trends and ideas. Take a look at 5 trends that could change the future of architecture.
Read more >
Intel Unveils Big Processor Architecture Changes
Intel Unveils Big Processor Architecture Changes. New cores for power and performance integrated into Alder Lake processor family with a tight Windows link....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found