Nice feature, thank you for the heads up! It could indeed be an easy way to update values both in the browser context and in the persistence via an HTTP call. Maybe you'll show us a nice implementation in November 🙂
I just encountered with your channel. linkedSignal might be good. I already use most of the signals features in production, but still have some issues, like: 1. viewChild signal returns inner component with a signal. And if I want to make computed signal based on inner component, I can’t, because there is the signal inside the signal. So, for this case I use the decorator ViewChild. 2. reactive forms are great, but don’t support signals (e.g. valueChanges). I hope it will change in the future
Making sure I understand, you used a linkedSignal in the http request because it is first null, being asynchronous and then resolves, and then sets the value to the request? Why would it not need a computation method implemented after the request completes. Is the computation only when you want a side effect or to mutate the data?
Instead of the example you made with http request used in a linkedSignal, should maybe the new angular v19 resource api be more suitable for that case? thanks for the video!
There are several options. You could use a subject/behaviorSubject: private userSubject = new Subject(); userSelected$ = this.userSubject.asObservable(); currentUser$ = this.userSelected$.pipe( map(id => this.http.get(`${this.url}?userId=${id}`)) );
I often had to fall back to a more procedural approach and add code to an event. Something like this: onProductSelected(p: Product) { this.selectedProduct.set(p); this.quantity.set(1); } But then I'd also have to add the code to reset the quantity anywhere else the product could change, such as deep linking. With linkedSignal, we can declaratively define the quantity and when it should reset. No need to add code anywhere the selected product could change.
I'll consider this new API as syntax sugar of the way Alex had introduced in this video: ruclips.net/video/aKxcIQMWSNU/видео.html&lc=UgzLINiOE616VnGxdQB4AaABAg.A8op9H13SrwA96TFOIQYj4
The model() is for two-way binding with a child component. The linkedSignal() works with or without child components. It allows one signal to affect another without making it read-only or having to use an effect.
I get that there are situations where you might want to track a signal without having to read its value, but surely it would be better to add an overload to the existing *effect()* function rather than create an entirely new API? effect(() => this.quantity.set(1), [this.selectedProduct]);
An effect doesn't return a signal. linkedSignal declares a signal, making the code more declarative (defining everything about the variable when declaring the variable). Plus the general guidelines is to avoid effects whenever possible, so the team didn't want to add features to effects.
Thanks @Deborah,
We always love your interesting videos.
And as always, we hope all the features of Angular19 come through your channel first!!!
Thank you!
I'm planning to do the new resource/rxResource next.
Great material from the best angular teacher.
I can't wait to use this feature.
Thank you!
Yes! Looking forward to trying it out.
Always love ur videos Deborah. Interesting topic here…thx for the heads up
Thanks! I expect to post more about it when it lands in a release.
This is gonna be a game changer. Looks more readable and intuitive. Thank you
Yes! Great addition to the signal feature set.
I never saw any value in using signals, but after watching your videos I simply love it and want to use it everywhere! Thank you for that!
Great to hear! Thanks for watching!
Tutorials from this woman I can confidently auto-like before I start watching them. I've yet to un-like a single one.
😊 Thank you so much!
I am the one waiting for your tips always.
Thank you!
Very clear, thanks.
Excellent! Thanks for watching!
I think this could be very useful for input signals
That's a great alternative for using effect!
Yes! 😊
Nice feature, thank you for the heads up!
It could indeed be an easy way to update values both in the browser context and in the persistence via an HTTP call.
Maybe you'll show us a nice implementation in November 🙂
Thank you!
Have you seen today's video as another option? ruclips.net/video/_KyCmpMlVTc/видео.html
I'm a big fan
Thank you so much! 😊
Yeah i felt the need for it since the begginig 😅 where i would use effect to write to signals to achieve the same effect
Yep! This is a great addition to the signal feature set.
Teacher 💙
😊
I just encountered with your channel. linkedSignal might be good.
I already use most of the signals features in production, but still have some issues, like:
1. viewChild signal returns inner component with a signal. And if I want to make computed signal based on inner component, I can’t, because there is the signal inside the signal.
So, for this case I use the decorator ViewChild.
2. reactive forms are great, but don’t support signals (e.g. valueChanges). I hope it will change in the future
Welcome!
Yes, the Angular team has said that they plan to revisit forms and provide a better integration with signals. Hope it's soon!
Making sure I understand, you used a linkedSignal in the http request because it is first null, being asynchronous and then resolves, and then sets the value to the request? Why would it not need a computation method implemented after the request completes. Is the computation only when you want a side effect or to mutate the data?
Instead of the example you made with http request used in a linkedSignal, should maybe the new angular v19 resource api be more suitable for that case?
thanks for the video!
My next video is planned to cover the new resource API.
Thanks for sharing this, ❤ your content as always. Is there any RFC for this, with more details on what Angular team is discussing on this?
Thank you! I would expect to see more info from the team in the next few days. I'll add the RFC link to the video notes when it's available.
@@deborah_kurata thank you
So what would be a good implementation in Angular v18 without the linkedSignal? Thanks in advance
with a switchMap. Something like this toSignal => ObservableFilters => switchMap(http), and in a pipe u can using tap, map, filter
There are several options. You could use a subject/behaviorSubject:
private userSubject = new Subject();
userSelected$ = this.userSubject.asObservable();
currentUser$ = this.userSelected$.pipe(
map(id => this.http.get(`${this.url}?userId=${id}`))
);
Don't forget to like and set the subscribe signal
😄
Great vid, teacher. What about the new resources api? Will you record a video too? It works like tanstack query. 😀
Thank you!
Yes, my current plan is to cover resource and rxResource in my next video.
You can try it in 19.0.0-next.11
Yep! That came out later in the same day as the video. I've updated the sample code for next.11 and added a bit more code.
How did you solve this kind of problem without the linkedSignal?
The way I found was to convert the signal to observable and then updating the value.
I often had to fall back to a more procedural approach and add code to an event.
Something like this:
onProductSelected(p: Product) {
this.selectedProduct.set(p);
this.quantity.set(1);
}
But then I'd also have to add the code to reset the quantity anywhere else the product could change, such as deep linking.
With linkedSignal, we can declaratively define the quantity and when it should reset. No need to add code anywhere the selected product could change.
I think for http requests the upcoming resource primitive is a better fit than linkedSignal
I'm currently planning to cover resource and rxResource in my next video.
I'll consider this new API as syntax sugar of the way Alex had introduced in this video: ruclips.net/video/aKxcIQMWSNU/видео.html&lc=UgzLINiOE616VnGxdQB4AaABAg.A8op9H13SrwA96TFOIQYj4
looks like a more complicated version of model()
The model() is for two-way binding with a child component. The linkedSignal() works with or without child components. It allows one signal to affect another without making it read-only or having to use an effect.
I get that there are situations where you might want to track a signal without having to read its value, but surely it would be better to add an overload to the existing *effect()* function rather than create an entirely new API?
effect(() => this.quantity.set(1), [this.selectedProduct]);
An effect doesn't return a signal. linkedSignal declares a signal, making the code more declarative (defining everything about the variable when declaring the variable).
Plus the general guidelines is to avoid effects whenever possible, so the team didn't want to add features to effects.