Fresh material on signal patterns is out, and the Angular Community meetup has shared the recording of their exclusive "The Women of Angular" session.
Signal Patterns
Merging Signals with Observables: Enea Jahollari & Chau Tran
As signals become more prevalent, the need for novel approaches grows. Last week, Enea Jahollori and Chao Tran addressed precisely this challenge.
Their work resulted in a utility function capable of applying RxJs pipe operators to a single signal, or to an array mixing Signals and Observables.
In practice, this relies on converting back and forth using toSignal and toObservable.
This approach has a broad range of applications worth exploring.
Consider a scenario where a signal holds a post. Additionally, an Observable carries the like count for that post.
The objective is to derive a qualityPost of type Signal, which holds only when post has a minimum of 10 likes.
Using computedFrom, both the post signal and the likes$ observable are taken together, running the RxJs filter and map operators on the combined stream.
@Component({
selector: 'app-post',
template: `<p>{{ qualityPost() }}</p>`,
standalone: true,
})
export class QualityPostComponent {
post = signal('The weather is nice today');
likes$ = interval(1000);
// switches to value of post after 10 seconds
qualityPost = computedFrom(
[this.post, this.likes$],
'',
pipe(
filter(([, likes]) => likes >= 10),
map(([post]) => post),
),
);
}
Auto Signal: Mike Pearson
Mike Pearson has also shared a pattern concept he calls "Auto Signal". This is intended for shared signals that rely on an underlying Observable.
His utility method functions similarly to toSignal, but it adds automatic unsubscription whenever the component holding the signal is destroyed.
What to Do and What to Avoid: Yevgeny Tuboltsev
Yevgeny Tuboltsev put together a piece highlighting recommended practices and common pitfalls — essentially anti-patterns — when working with Signals.
Medium
The Women of Angular
The Angular Meetup has published the footage from their distinctive session called "The Women of Angular". It featured two presentations.
Maria Korneeva explored the topic "What do great women in IT and Angular have in common", while Martina Kraus addressed Signals and RxJs.
Following the talks, there was a panel conversation with prominent women from the Angular ecosystem.
Fresh Releases
Nx, which serves as an alternative to the Angular CLI, has landed version 16.7. For E2E testing, it now offers a choice between Playwright and Cypress.
PrimeNg, the UI component library, is available in version 16.2.
Ionic, the cross-platform toolkit, has moved up to version 7.3.
Angular 17 has reached its initial pre-release milestone. It already includes the first steps toward the control-flow syntax for templates.