This past week, I ran into a need to dynamically add components using Angular. My specific reason for doing this is that the component I am using is a port of an AngularJS component and so it doesn’t quite conform to the Angular way of doing things. Specifically, I can’t change input values and have the component respond reliably. But, regardless of why I need this functionality, or even why you may need this functionality, I think being able to do this at all is pretty cool.
If you are programming in Angular and haven’t tried Model Driven Forms yet, I’m assuming that is because you’ve not taken the time to try to learn it. In this article, I am going to try to convince you that the Model Driven Form based approach is superior to Template Driven Forms and that the only people that are still using Template Driven Forms are people who either have not been enlightened or lazy.
If you are using Angular(2+) and you are looking for an easy way to layout your components that gives you lots of flexibility and very few restrictions, you owe it to yourself to checkout Angular Flex Layout. While it is still in Beta, the framework is quite usable. I’ve been using it in one of my projects and I’ve been quite happy with the results.
Unit Testing Angular(2+) with JSDOM can be problematic unless you know the secret handshake that allows ZoneJS and JSDOM to coexist.
The great thing about Angular is that you can write Unit Tests from the presentation layer all the way down to calls to the server. But up until now, you either ran those tests in a browser, which doesn’t work well in a CI system, or you used PhantomJS, which tends to be REALLY slow! But there is a better way, and hopefully, by the time this post goes live, the patches needed to use JSDOM will be available. If not, I’ll show you the hack that I’ve found works and the pull request I’m hoping will go live.