r/Angular2 • • Jun 24 '26 Hooray

Announcement Announcement: We are merging with r/angular

268 Upvotes

Hi everyone,

We’re moving Angular discussions to r/angular.

r/angular2 made sense when Angular 2 was the name people were searching for. Today, Angular is just Angular, and having two active communities splits questions, answers, news, and moderation across duplicate spaces.

To make things clearer, this subreddit will remain available as an archive, but new posts should go to r/angular

If you’re here with a question, release post, article, tutorial, library, migration issue, or general Angular discussion, please post it in r/angular instead.

Thanks for participating in this subreddit, and see you in r/angular.


r/Angular2 • • Jun 24 '26

ngx-datatables-net: a clean, signal-driven DataTables wrapper for Angular 22 (and 20/21)

7 Upvotes

Hey everyone. This is our first real attempt at building and open-sourcing an Angular library, so honest feedback is very welcome (including the harsh kind).

We lean on DataTables a lot, but the long-standing angular-datatables was archived in early 2025 and never moved past NgModules and Zone.js. We wanted something that feels native to modern Angular, so we built ngx-datatables-net: a directive wrapper on DataTables' non-jQuery API, driven by signal inputs, standalone, and zoneless-ready. It targets Angular 20, 21 and 22 with a separate release line for each.

There's also a small add-on: free double-click edit-in-place (text, number, date, select, multiselect and custom editors, with validation and async saving). This is a custom extension and doesnt require Datatables Editor.

Re usage of jQuery: DataTables uses it internally, so it's still in the bundle. You just never write it, and it's not a peer dependency in the angular wrapper.

Next on the roadmap, we have planned a few more customizations such as : master/detail rows, row grouping, clipboard copy/paste, and cell selection - these codes are scattered across custom implementations across various projects, we will be bringing them together and clean the code a bit before publishing.

GitHub:https://github.com/ascentspark/ngx-datatables-net
NPM: https://www.npmjs.com/package/ngx-datatables-net
Live demo (Sandbox) and docs: https://ngx-datatables-net.ascentspark.com/

Thank You for looking!


r/Angular2 • • Jun 24 '26

I built an open-source Fleet Management App for Humanitarian NGOs mostly using AI. Now I need human experts to review the code! (Angular / Node.js)

0 Upvotes

Hi everyone!

I’ve been working on FleetTrack, a comprehensive open-source web and mobile progressive web app (PWA) designed to manage vehicle fleets, logbooks, and predictive maintenance for Humanitarian NGOs operating in challenging environments.

The Context & Mission NGOs often operate in remote areas where keeping track of vehicle movements, driver security, and generator maintenance is critical, but existing enterprise tools are often too expensive. This project is 100% non-profit and open-source. Its goal is to provide NGOs with a modern, free, and robust tool.

It was heavily built with AI To be completely transparent, I built a large portion of this application using AI coding assistants. While it works perfectly in production right now and fulfills all the operational needs, I know AI isn't perfect.

This is why I need human experts! Since this is a non-profit tool dedicated to humanitarian aid, I want to ensure the foundations are rock solid before we scale it to more NGOs. Any help is incredibly welcome! Whether you are a senior dev willing to audit the code or a junior looking for an open-source project, we need you. You can help with:

·        Code Review & Architecture: Tell me where the AI messed up, what patterns are bad, and how to improve the Angular/Node architecture.

·        Refactoring: Cleaning up tech debt and optimizing performance.

·        Security: Auditing the auth and data isolation (multi-tenancy).

·        Ideas & UI/UX: Proposing better flows for the drivers using the app offline; or new modules or functionalities.

 

If you want to use your coding skills for a good cause and tear apart some AI-generated code to make it enterprise-grade, please check out the repository!

 GitHub Repo (Screenshots inside!): https://github.com/Archi-web3/FleetTrack

Feel free to roast the code in the comments or open an issue on GitHub. Thanks for reading!


r/Angular2 • • Jun 23 '26

Video Angular Material Theming Course

Post image
27 Upvotes

Youtube Playlist link: https://youtube.com/playlist?list=PLOjtJUnDeEIyaeUs_jrxylnD2IxSb3Ku7&si=KE504zK-zr7tD5f8

Master Angular Material's theming system for Material 3 design system

Angular Material has become a cornerstone in the Angular ecosystem, offering a comprehensive suite of UI components that seamlessly integrate with Angular applications. With its robust theming capabilities, Angular Material allows developers to create visually stunning and highly customizable user interfaces.

In this course, you'll dive deep into Angular Material's theming system, learning how to build and customize themes that perfectly align with your application's design requirements. You'll explore the intricacies of Angular Material's theming API by creating and modifying themes. By the end of this course, you'll have the skills to create, modify and extend themes for your Material, not only for whole application but also for individual components.

You can also get article format of this course at https://angular-ui.com/courses/angular-material-theming/.

All codes are available on GitHub at https://github.com/Angular-UI-com/angular-material-theming


r/Angular2 • • Jun 23 '26

Is PrimeNg abandonned?

1 Upvotes

Hi,

I was wondering what's going on with PrimeNG lately. The last minor release was at the end of January, and since then I've only seen patch releases. It's a bit concerning because our project relies heavily on PrimeNG v21, which still has a few compatibility issues with Angular 21. As a result, moving to Angular 22 isn't really feasible for us right now.

Thanks.


r/Angular2 • • Jun 21 '26

Article Angular 22: linkedSignal() Can Now Write Back to State

17 Upvotes

r/Angular2 • • Jun 21 '26

Help Request Still building my Angular PWA manga reader after work: v0.5 is out, would love some feedback

6 Upvotes

Hey everyone (´• ω •) ♡

I've been slowly working on MangaOfflineViewer in my spare time, mostly after work and on weekends.

The project originally started as an excuse to learn more about PWAs and offline-first development. I've always liked the idea that an app should keep working even when your internet connection decides to take the day off.

After many evenings, too much coffee, and a lot of refactoring, I just finished v0.5.

What's new?

  • UI improvements and general cleanup

  • Search by title, tags, and artists

  • Horizontal reading and dual-page mode

The app is still offline-first. Import your manga once and keep reading without needing a connection.

That said, I'm sure there are bugs hiding somewhere. Probably quite a few of them. 😅

If you decide to try it and run into issues, I'd really appreciate bug reports, feature suggestions, or any feedback in general.

I'm also interested in hearing opinions on the technical side. If there are better libraries, frameworks, or approaches for building reliable offline applications across different devices, I'd love to learn from people with more experience.

GitHub:
https://github.com/zarar384/MangaOfflineViewer


r/Angular2 • • Jun 20 '26

Angular Reactive Form not updating when browser autofills saved credentials

4 Upvotes

I'm working on an Angular login page using Reactive Forms.

When the browser autofills saved username and password credentials, Angular doesn't always seem to detect the values immediately. As a result, my Login button remains disabled until the user interacts with the page.

I noticed that checking for browser autofill using selectors such as :-webkit-autofill appears to work in some browsers, but I'm unsure whether this is the recommended approach or if there's a better cross-browser solution.

How do you handle browser autofill in Angular Reactive Forms?

Specifically:

  • How do you detect when username and password fields have been autofilled by the browser?

  • How do you keep Reactive Forms synchronized with autofilled values?

  • Is relying on autofill selectors the correct approach?

  • What is the recommended solution for enabling/disabling a Login button when credentials are autofilled?

The application needs to support Chrome 90+, Edge 90+, Firefox 90+, and Safari 14+.

Any guidance or best practices would be appreciated.


r/Angular2 • • Jun 18 '26

Build polished Apple-style UIs in Angular + Tailwind

10 Upvotes

TL;DR: https://windframe.dev/styles/apple

Hi everyone 👋

I’ve been experimenting with building Angular + Tailwind interfaces inspired by the design systems of really well-designed products. I recently worked on a style system for generating interfaces using similar design principles to Apple.

It focuses on polished product presentation, strong visual hierarchy, refined spacing, soft gradients and using fewer words to make each section feel clear and intentional.

I built a UI system that makes it easy to generate interfaces in this design direction consistently. It can generate full UIs, landing pages, and product sections that follow the same Apple-inspired style.

I also created a set of free Tailwind templates built around this style that you can use as starting points for your Angular projects: you can find those here

This style is also available as a selectable preset in Windframe. When selected, the AI generates Angular interfaces that follow the same design guidelines and visual style.

I also built an MCP for this, so you can use these same style systems directly inside any coding agent that supports MCP: https://windframe.dev/mcp

If you’re not familiar with Windframe, it’s a visual Tailwind builder/editor that lets you generate polished Angular UI with AI, tweak it visually, and export clean production code.

Would love any feedback or thoughts : )


r/Angular2 • • Jun 16 '26

Article Angular Addicts #50: Angular 22, Agentic Angular, Deploying to the Cloud & more

Thumbnail
angularaddicts.com
7 Upvotes

r/Angular2 • • Jun 13 '26

Discussion Built a Signal debouncing utility few months ago. Angular 22 now ships native debounced()

42 Upvotes

I built a Signal debouncing utility for Angular few months ago and now Angular 22 ships a native debounced() API.

That coincidence definitely caught my attention.

Back then, I published a small package called @gitesh08/signal-utils because I wanted a cleaner way to debounce Signals without reaching for RxJS every time.

After reading the docs, Angular’s implementation is actually quite different since it returns a Resource with loading states, cancellation, lifecycle management, and more. My utility is much simpler and focused on lightweight signal debouncing.

Still, it’s a cool feeling seeing Angular solve a problem I spent time thinking about months ago.

It’s also interesting to see how the Angular Signals ecosystem is evolving and becoming more capable with each release.


r/Angular2 • • Jun 12 '26

New in Angular 22: Directives for CDK Component Portals

Thumbnail itnext.io
5 Upvotes

r/Angular2 • • Jun 10 '26

Resource FrameUI - Angular component library

19 Upvotes

I just released the first beta of FrameUI, an Angular component library inspired by shadcn.

It uses Angular CDK , CSS variables for theming, and ships components like Button, Select, Modal, Table, Date Picker, Toast, etc.

I’d really appreciate feedback from Angular devs.

Docs: https://frame-ui.com

GitHub: https://github.com/Gamekohl/frame-ui


r/Angular2 • • Jun 08 '26

Angular Material Dialogs Now Support Real Component Bindings

Thumbnail itnext.io
30 Upvotes

r/Angular2 • • Jun 08 '26

Need your opinions

Thumbnail reddit.com
0 Upvotes

r/Angular2 • • Jun 07 '26

What Is SDuX Vault? A pipeline-based state engine that works the same way in Angular, React, Vue, and Svelte

0 Upvotes

I've been building a state management system called SDuX Vault that takes a different approach from Redux/NgRx. Instead of actions and reducers, state updates flow through a deterministic pipeline of composable stages (filtering, reduction, observation, persistence). The entire API surface is four concepts: Vault, FeatureCell, State, and Snapshot.

It's framework-agnostic — built on standard TypeScript primitives with thin adapters for Angular, React, Vue, and Svelte. Same pipeline logic everywhere, no lock-in.

Wrote up a detailed intro covering the problem, the architecture, and the core concepts: go.sdux-vault.com/b001-reddit

Live StackBlitz demos available if you want to try it without installing anything.

https://sdux-vault.com/docs/stackblitz


r/Angular2 • • Jun 07 '26

Angular

0 Upvotes

Looking for a person to start a career in angular, who can guide me or help me with that...


r/Angular2 • • Jun 07 '26

CODERBYTE Angular version ?

0 Upvotes

hi, im passing an assignment tomorrow and i want know the version of angular that coerbyte uses.

or what do you think its most likely (17+ or less)

pls if you have an idea you help is much appreciated.


r/Angular2 • • Jun 05 '26

Help Request Angular, Supabase and SSR

5 Upvotes

First of all, I'm a Software Junior Developer, so I would appreciate any insight information about any basic concept. I apologize in advance if I make mistakes that are not clear to me, but are clear for you.

I created an Angular (v20) project with SSR and SSG. I want to use Supabase with Google OAuth for Authentication and Database.

I generated a SupabaseService where I call createClient from SupabaseClient:

import { Injectable } from '@angular/core';
import { createClient, SupabaseClient } from '@supabase/supabase-js';
import { environment } from '../../../environments/environment';


u/Injectable({
  providedIn: 'root',
})
export class SupabaseService {
  client!: SupabaseClient;

  constructor() {
    this.client = createClient(
      environment.supabaseUrl,
      environment.supabaseKey,
    );
  }
}

Then, in my AuthService, when I inyect my SupabaseService:

import { Injectable } from '@angular/core';
import { SupabaseService } from '../supabase/supabase.service';

u/Injectable({
  providedIn: 'root',
})
export class AuthService {
  constructor(private supabaseService: SupabaseService) {}
}

The app stop working and can't initialize. If I sustract "constructor(private supabaseService: SupabaseService)", the app works normally.

I don't have any errors in console or compilation, but I found that it could be an error with Angular SSR and Supabase. I would really appreciate if someone could deep explain (or link well explained references) the SSR concept, how it works with Supabase and why this is happening (and a solution for this, even if it implies not using SSR or other major change).

Thank you!


r/Angular2 • • Jun 04 '26

Reactive Forms to Signal Forms: A Practical Migration Guide for Angular

Thumbnail itnext.io
23 Upvotes

r/Angular2 • • Jun 03 '26

Announcing Angular v22

Thumbnail blog.angular.dev
85 Upvotes

r/Angular2 • • Jun 02 '26

Article Angular libraries - to include or not include an LLM.txt

1 Upvotes

I ran a small benchmark to see how reliably AI agents generate Angular state-management code when they’re given library docs as context.

The setup: Five Angular state libraries. Eight prompts.

Three priming modes: no docs, llms.txt, and llms.txt plus a second guidance doc.

Six models. 720 scored outputs total. Temperature 0.

Same prompts for each library.

The part I cared about was not “which library wins.” I maintain one of the libraries in the test, so the absolute ranking is not the interesting bit anyway. The interesting bit was what happened between runs.

In the first run, adding a 14KB llms.txt file improved generated code a lot for my library. It went from 49% correct to 91%. Good result. Or so I thought. Then I added a second doc as extra context and accuracy dropped to 87%. One model fell off especially hard. Another model seemed stuck at 80%, even with docs.

My first explanation was pretty lazy: “Context dilution.”
“Maybe that model just can’t do this library well.”
“Probably a model architecture thing.” Then I looked at the failures. The agents were not hallucinating randomly. They were copying bad information from my own docs.

A few examples: byId() was documented as returning a Signal, but it actually returns EntityNode | undefined. updateMany was documented with the wrong shape.

One documented subpath import did not exist.

Deprecated method names were still being taught as canonical in multiple files.

A tagline had been updated in one doc but not in the others.

There were about 70 doc issues across four files. Some had been wrong for multiple releases. The API had changed, but the docs had not been re-grep’d carefully afterward. So I fixed the docs and ran the same benchmark again. Same models.
Same prompts.
Same scoring.
Cleaner docs. The score moved from 49% to 98%. Five of the six agents hit 100/100. The “context dilution” result also flipped. Adding the second doc now improved accuracy instead of hurting it.

So the problem was not that the context was too long. The problem was that the context contradicted itself. The model that looked like it had an 80% ceiling also reached 100/100 after the docs were fixed.

That was the useful lesson for me: for this kind of codegen, docs are not just user-facing documentation anymore. They are also training-time-ish context for tools people are already using. If the docs are stale, vague, or internally inconsistent, the generated code fails in ways that look like model weakness. But sometimes the model is doing exactly what you told it to do. You just told it the wrong thing. The benchmark made that visible faster than normal user reports would have.

The thing I’d defend here is not the absolute score. I wrote the library, the prompts, the priming docs, and the rubric, so the exact numbers are easy to argue with. The relative movement is harder to ignore.

Bad docs: 49% cold, 91% with one doc, 87% with two conflicting docs.


Cleaned-up docs: 98%, with most agents perfect.

For anyone maintaining a library that people use with Cursor, Claude Code, Copilot, or similar tools, it may be worth treating docs like executable surface area:

• remove stale examples • grep for old method names • test documented imports • keep llms.txt consistent with normal docs • avoid documenting “almost right” API shapes • make deprecated patterns visibly deprecated everywhere

The boring work mattered more than I expected.


r/Angular2 • • Jun 02 '26

Stale docs caused most AI codegen failures in my Angular state benchmark

1 Upvotes

I ran a small benchmark to see how reliably AI agents generate Angular state-management code when they’re given library docs as context.

The setup:

Five Angular state libraries.

Eight prompts.

Three priming modes: no docs, llms.txt, and llms.txt plus a second guidance doc.

Six models.

720 scored outputs total.

Temperature 0.

Same prompts for each library.

The part I cared about was not “which library wins.” I maintain one of the libraries in the test, so the absolute ranking is not the interesting bit anyway. The interesting bit was what happened between runs.

In the first run, adding a 14KB llms.txt file improved generated code a lot for my library. It went from 49% correct to 91%. Good result. Or so I thought. Then I added a second doc as extra context and accuracy dropped to 87%. One model fell off especially hard. Another model seemed stuck at 80%, even with docs.

My first explanation was pretty lazy: “Context dilution.”
“Maybe that model just can’t do this library well.”
“Probably a model architecture thing.” Then I looked at the failures. The agents were not hallucinating randomly. They were copying bad information from my own docs.

A few examples:

byId() was documented as returning a Signal, but it actually returns EntityNode | undefined. updateMany was documented with the wrong shape.

One documented subpath import did not exist.

Deprecated method names were still being taught as canonical in multiple files.

A tagline had been updated in one doc but not in the others.

There were about 70 doc issues across four files. Some had been wrong for multiple releases. The API had changed, but the docs had not been re-grep’d carefully afterward. So I fixed the docs and ran the same benchmark again. Same models.
Same prompts.
Same scoring.
Cleaner docs. The score moved from 49% to 98%. Five of the six agents hit 100/100. The “context dilution” result also flipped. Adding the second doc now improved accuracy instead of hurting it.

So the problem was not that the context was too long. The problem was that the context contradicted itself. The model that looked like it had an 80% ceiling also reached 100/100 after the docs were fixed.

That was the useful lesson for me: for this kind of codegen, docs are not just user-facing documentation anymore. They are also training-time-ish context for tools people are already using. If the docs are stale, vague, or internally inconsistent, the generated code fails in ways that look like model weakness. But sometimes the model is doing exactly what you told it to do. You just told it the wrong thing. The benchmark made that visible faster than normal user reports would have.

The thing I’d defend here is not the absolute score. I wrote the library, the prompts, the priming docs, and the rubric, so the exact numbers are easy to argue with. The relative movement is harder to ignore.

Bad docs:

49% cold, 91% with one doc, 87% with two conflicting docs.


Cleaned-up docs: 98%, with most agents perfect.

For anyone maintaining a library that people use with Cursor, Claude Code, Copilot, or similar tools, it may be worth treating docs like executable surface area:

• remove stale examples

• grep for old method names

• test documented imports

• keep llms.txt consistent with normal docs

• avoid documenting “almost right” API shapes

• make deprecated patterns visibly deprecated everywhere

The boring work mattered more than I expected.


r/Angular2 • • Jun 02 '26

Stale docs caused most AI codegen failures in my Angular state benchmark

1 Upvotes

I ran a small benchmark to see how reliably AI agents generate Angular state-management code when they’re given library docs as context.

The setup: Five Angular state libraries. Eight prompts.

Three priming modes: no docs, llms.txt, and llms.txt plus a second guidance doc.

Six models. 720 scored outputs total. Temperature 0.

Same prompts for each library.

The part I cared about was not “which library wins.” I maintain one of the libraries in the test, so the absolute ranking is not the interesting bit anyway. The interesting bit was what happened between runs.

In the first run, adding a 14KB llms.txt file improved generated code a lot for my library. It went from 49% correct to 91%. Good result. Or so I thought. Then I added a second doc as extra context and accuracy dropped to 87%. One model fell off especially hard. Another model seemed stuck at 80%, even with docs.

My first explanation was pretty lazy: “Context dilution.”
“Maybe that model just can’t do this library well.”
“Probably a model architecture thing.” Then I looked at the failures. The agents were not hallucinating randomly. They were copying bad information from my own docs.

A few examples: byId() was documented as returning a Signal, but it actually returns EntityNode | undefined. updateMany was documented with the wrong shape.

One documented subpath import did not exist.

Deprecated method names were still being taught as canonical in multiple files.

A tagline had been updated in one doc but not in the others.

There were about 70 doc issues across four files. Some had been wrong for multiple releases. The API had changed, but the docs had not been re-grep’d carefully afterward. So I fixed the docs and ran the same benchmark again. Same models.
Same prompts.
Same scoring.
Cleaner docs. The score moved from 49% to 98%. Five of the six agents hit 100/100. The “context dilution” result also flipped. Adding the second doc now improved accuracy instead of hurting it.

So the problem was not that the context was too long. The problem was that the context contradicted itself. The model that looked like it had an 80% ceiling also reached 100/100 after the docs were fixed.

That was the useful lesson for me: for this kind of codegen, docs are not just user-facing documentation anymore. They are also training-time-ish context for tools people are already using. If the docs are stale, vague, or internally inconsistent, the generated code fails in ways that look like model weakness. But sometimes the model is doing exactly what you told it to do. You just told it the wrong thing. The benchmark made that visible faster than normal user reports would have.

The thing I’d defend here is not the absolute score. I wrote the library, the prompts, the priming docs, and the rubric, so the exact numbers are easy to argue with. The relative movement is harder to ignore.

Bad docs: 49% cold, 91% with one doc, 87% with two conflicting docs.


Cleaned-up docs: 98%, with most agents perfect.

For anyone maintaining a library that people use with Cursor, Claude Code, Copilot, or similar tools, it may be worth treating docs like executable surface area:

• remove stale examples • grep for old method names • test documented imports • keep llms.txt consistent with normal docs • avoid documenting “almost right” API shapes • make deprecated patterns visibly deprecated everywhere

The boring work mattered more than I expected.