💥 NEW In Angular 17.3 🚀 output() and New RxJs Interoperability

[@AngularUniversity]

Let me know what you think about the features of the Angular 17.3 release. Excited that signal component authoring APIs are mostly completed? 😊 Next up, signal-based forms and signal change detection. 🚀

[@Lesnikovskiy]

And signal based http client

[@paweld.9542]

After doing update from 17.1 to 17.3 I'm gettin an error messages 1. Imports must be an array of components... 2. changeDetection must be a member of ChangeDetectionStrategy enum from @angular/core I don't know what is going on. Everything works fine but the error messages are still there in visual studio code...

[@AngularUniversity]

@@paweld.9542 If everything is still working fine at the level of the Angular CLI, that's what counts. That must be an IDE issue then. 👍

[@paweld.9542]

@@AngularUniversity Yes, thanks very much for your response. Maybe next update will make the errors disappeared or maybe it's a TS config problem :)

[@paweld.9542]

The error has gone just after restart the visual studio code 😅

[@LarsRyeJeppesen]

This is just mind blowing features we have been getting since IVY. The changes and features are so so nice. I really look forward to the final goal: signal components, and removal of ZoneJS. Let's hope V18 will introduce these features, but there are lots of 3rd party libraries that are not ready for zoneless (even Material is far far away from allowing it).

[@AngularUniversity]

Yes, the pace of change has been huge lately 😊 signal components is next, as well as zoneless, which will be it's own separate thing. That one is still in the works 😊

[@sajjanm01]

thanks for this video. Made my morning knowledgeful 👏

[@AngularUniversity]

Thank you 😊 Please enjoy the videos. 👍

[@davidcooper4327]

Honestly, as a noob, it's hard to keep up with the changes. However, I love that Angular is committed to backward compatibility. It gives me time to absorb the information before having to bring on new concepts.

[@AngularUniversity]

I think that's the spirit 👍 learn now slowly and gradually, one video and one concept at a time. This way, later this year when signal change detection arrives, you already learned all about it. Check out the videos here on the channel, mostly about signals lately👍😊

[@yufgyug3735]

if you work with more than one technology, it quickly gets impossible to keep up with all changes, improvements etc. just do your best and try to learn something small every day.

[@AngularUniversity]

@@yufgyug3735 I think that's the way to go 👍 Also, Angular has been changing a lot lately, but it's not always that way. Things will get much more stable soon 👍

[@LarsRyeJeppesen]

The changes are many but very very good.

[@naspy971]

Man you should be a GDE !

[@Brendan2Alexander]

very helpful video. love this signals approach. I turned my cat into a signal.

[@AngularUniversity]

Thank you 😊 I'm sorry to hear about your cat 😂

[@LarsRyeJeppesen]

I turned my daughter into a Signal. Much less complex, and much more manageable.

[@AngularUniversity]

@@LarsRyeJeppesen 🤣

[@nathanalberg]

Since you are promoting async instead of rxjs for api calls. I’d like to see a video on error handling / messaging.

[@AngularUniversity]

I don't think it's a matter of me promoting it, it's just a language feature already used by a lot of Angular projects that is there and can used by anyone.😉👍 Error handling I show it in one my videos, I think this one kzbin.info/www/bejne/oYXWh613pr1lrcU Essentially we just use try / catch, another language feature. 👍

[@AntonioSantana-ll8il]

Loving your udemy and KZbin courses🎉🎉🎉 ❤❤

[@AngularUniversity]

Thank you Antonio, you the videos 👍😊

[@hatsvids]

With this new functionality, is the Signals API complete? What other Signal APIs might still be missing, given that the Angular team seems unwilling to take on the Store component and will leave that to external libraries? Will we see the Signals API coming out of "developer preview" state in 17.3 final release or only in the next major version?

[@AngularUniversity]

I think it will be out of preview most likely on Angular 18, as far as APIs mentioned in the RFCs output() was the last one. the next is signals:true, signal-based change detection 😊 Right now it's not clear yet, it will be when it's ready, but I'm going to take a wild guess and say it's for 18, maybe in a minor release, that's what I'm hoping. 👍

[@slavenml9799]

What's difference between subscribing directly to output property (output is already observable and we can subscribe to it) and using outputToObservable?

[@AngularUniversity]

This transform it into a full blown observable. the output has a subscribe method but it's not really an Observable, you can't apply pipe to it.

[@pedro.lizarraga]

Excellent content, greetings

[@AngularUniversity]

Thank you, enjoy the videos 😊

[@boris8983]

What is the use of outputToObservable? can you give an example when to actually use this?

[@AngularUniversity]

It's a nice generic interoperability feature, but I don't think we are going to be using it every day. For example thiscould come in handy if you want to trigger an Observable chain in response to an output getting emitted. For example to save someting on local storage as a side effect. 👍

[@boris8983]

@@AngularUniversity So there is automatically a subscription that I don't have to worry about? That is unsubscribed by Angular e.g. on destroy

[@manojht8036]

Sir I have a doubt, please help me with this one, we have input() now in place of @Input() which will convert it as InputSignal correct ? How do I change the values of that variable ? I am not telling about the transform function, now that variable is created let's say a string how do I do "replace"? Or if it's some custom type, now I need to change the whole value of that variable? Because I tried to set and update like signal but that didn't work

[@AngularUniversity]

That"s a great question, input signals cannot be modified they are read-only. If you want to modify the value of an input, you need to do it in the parent component. On the other hand, if you want to be able to modify data passed from the parent component, you can use model() signals instead, which are writeable inputs. Check this video for more details about it - kzbin.info/www/bejne/pYqwnmOMr9-Aj7c 👍

[@vincentbrigand8440]

hey! Just a quick question I'm planning on naming my company "angular-something" (nothing to do with online lessons). Did you needed a particular permission to call your company angular-university? best

[@AngularUniversity]

No you don't need any special permission, as long as it's clear that you are a separate entity.

[@vincentbrigand8440]

@@AngularUniversityThank you for your answer this really helps

[@codered1122]

Can it send data from parent to child also?

[@AngularUniversity]

Actually no, outputs are one way only, from child to parent. It's model inputs that can do that, I have a separate video about it here on the channel - kzbin.info/www/bejne/pYqwnmOMr9-Aj7c 👍

[@codered1122]

@@AngularUniversity thanks for the reply , I will refer this video

[@kensei9531]

I'm trying to use custom directives in 17.2 but it doesn't work. Is there a problem with the custom directives? I used it according to documentation but still it is not working.

[@AngularUniversity]

Custom directives were not impacted with these releases, they have been working since forever. 👍 I think the cause of the error must be something else, what error do you get?

[@kensei9531]

@@AngularUniversity I generated a directive with CLI. I added a host listener and added the directive to a button. Nothing happens

[@AngularUniversity]

@@kensei9531 Is it a standalone directive? you need to import it in the component where you are using it, otherwise it won't work.

[@kensei9531]

@@AngularUniversity I tried everything you wrote but unfortunately, it is not working.

[@ivanco_s]

COOL 💙💛

[@realfootball338]

Hope all TS Decorators will be optional and then removed at all.

[@AngularUniversity]

I think becoming optional most of them already are, but removing them, I don't think it will be possible at least not in the next coming years, due to backwards compatibility. 👍

[@realfootball338]

@@AngularUniversity component/injectable/directive still are not optional

[@AngularUniversity]

@@realfootball338 The main ones will take a while, only with the new functional authoring format sometime in the next future, probably not yet this year. But many other decorators are optional: @Input, @Output, @ViewChild, etc.

[@DisturbedNeo]

If you make sure your service isn’t using any lifecycle hooks, and you create a provider for it that looks like: { provide: Service, useClass: Service } You can put it to your application config and remove the @Injectable decorator from the service. Injection via constructor or the inject() function works just fine. All you need to do is make sure Angular can recognise the class as a provider, which is essentially what the @Injectable decorator does. Now we just need a way to register a class as a component in a similar way, and we could end up with decorator-less Angular applications.

[@AngularUniversity]

@@DisturbedNeo Very interesting thought, thank you for sharing. 👍

[@bushbuddyplatypus]

I can't find any jobs in Angular ! I bloody hate React but now I am a slave to it

[@AngularUniversity]

Depending on where you are in world, the enterprise tends to use Angular and those are good paying, stable jobs. Keep looking, you will find it 😉

[@bushbuddyplatypus]

@@AngularUniversity thanks