🌐 Angular : Best practices after the renaissance #2

#angular #standalone

Using standalone components gives you more control over your components compared to the traditional NgModules approach. It allows you to import components directly into each other without the need to go through modules. Standalone components help reduce the number of modules in your project, which translates to less code to manage.

💛 NgTemplateOutlet Type Checking

#angular #directive #ngTemplateOutlet

✅ Article link

🚱 No more try-catch

#js #trycatch

An amazing new JavaScript operator has arrived and things are not looking too good for try-catch!

While we wait for ?= to become natively integrated into JavaScript, we can start it now with this polyfill

✅ Article Link

🩶 Media query matcher in Angular with RxJS, signals and NgClass

#angular #signals #service #matchMedia

To achieve the desired outcome, I’ve opted for an approach that follows this pattern:

— Create a service with a `mediaQuery()` method, which returns an RxJS Observable containing information on whether a specific breakpoint is matched or not.

— Create a property inside the component class (in the example we will call it `isMobile`, since we have only one breakpoint) and bind it the the `mediaQuery()` method previously crafted, but also converting the Observable to a signal.

— Utilize the `NgClass` directive to dynamically apply a class based on the value of the `isMobile` property.

✅ Article Link