Join my mailing list for more exclusive content and access to the archive of my private tips of the week: mobirony.ck.page/4a331b9076

Personal I prefer the markForCheck solution. As you said it does the same thing that the async pipe does, so why not do it in the component when async pipe is not a direct solution. I personal don't like the solution of updateValueAndValidity and the async pipe on statusChanges. It is a workaround (two indirect steps) to get angular change detection running. If you need the change detection running, just do it explicitly then everyone understands what is going on.

I am loving this channel more and more. Lots of quality information right here. Thank you for the videos!

Thanks for these videos, learning a lot from you even after working as a dev for years. Quality content!

I feel like if you were going to add an empty ng-container that will break things if it is removed we should probably be adding a comment to it so that a co-worker doesn't remove it down the road as part of a cleanup effort, but I basically never see comments in angular templates. Is lack of html comments in angular templates left over from the old angular.js days where comments had meaning or is there a better reason no body comments logic in templates?

I'm not sure I agree with the OnPush statement "It helps you architect your applications better" if you are left with an `` element within your HTML just to trigger change detection. To me, the template should be purely for presentation/user interaction. But just like you, I'm not really a big fan of ChangeDetectorRef as if feels like a "hack" to get something working. I am trying to find more valid use cases for OnPush, but so far in an application with over 1000 components I have yet not run in to any performance issues, but I am interested in seeing how it could help with component architecture!

Your channel is very good for us. Thanks for the content, keep making it.

Excelent content of this channel! I'm learning a lot! Thanks!

Super stuff. Thanks Man!

Great stuff!

The Last trick was the solución i needed for a validación i'm doing on an aplicativo in my current job 🎉🎉🎉🎉🎉

It's a good implementation of an async pipe, but kinda hesitant to implement this on a parent-child with multiple forms inside the child component. Perhaps I will try to play around with it. Great explanation 👍

If I have a formarray and in each row there is a drop down list. Is there any problem using async to populate the list of the drop down bearing in mind there are multiple formarrays rows?

thanks helpful vid

How could we use this approach if we are using custom elements (e.g. implementing control value accessor)? We shouldn't use formControlName should we?

Quick question about the validity of a control while an async validator is doing its work, I noticed that valid is turned into false on the control, while invalid stays false, any idea why that happens ? love your work, keep up the good work :D

Joshua, how you make to display the browser window inside VS Code on the right side?

One caution with updateValueAndValidity, it's not reentrant (issue #21109). We ran into the issue when using the valueChanges of one control to update the validation of another.

I guess my best practice would be to compose a "stream of changes" that should trigger cd. *ngIf="runCd$ | async" When using rxAngular we could "hold" the sub

I don't like the markForCheck, but that's just me, as you say, it's a matter of choice and how our components are built. Thanks for the reflexions, this is a real issue !

Do you personally use nonNullable in all your forms?

I'm curious... Was the inspiration for this video from a Reddit comment made recently? As I pretty much posted this exact problem yesterday 😄 If not, just a huge coincidence but I'm looking forward to trying this out!

@Joshua Morony, maybe dumb but might be possible to use ngrx or at least a behavior subject to wrap the form as a piece of state, then nexting it whenever you need to run it through async for free cd call

Chance goes to show that CD is not the best thing. I'm really psyched about signals. It seems better than change detection or top-down rerendering like in react

i'd use Cdr and you can implement a directive for that that just subscribe to status change and trigger markForCheck

i wanted to watch it later but the thumbnail made me click on it in my office. :{)

'sdfsdf' is also what I end up typing when I need to randomly fill an input 😅

I haven't used onPush yet but it seems more like a headache than a blessing..

That's a neat trick but I think you just built a case for not using OnPush on every single component. If I was another developer walking into that code, I'd be deleting that seemingly useless ng-container and then wondering why the code is broken. I agree using the CD ref feels like cheating or like you don't actually want OnPush.

I use OnPush in almost almost all of my dumb components but I'd draw a hard line when I'd have to do some crazy workarounds. The empty ng-container is just bad in my opinion. You'd have to leave a big comment explaining while this is even needed, otherwise there is a good change someone else passing over the component later might think "wait a second, that's not rendering something, let's remove this". And for good reasons, it's a bit of weird hack, isn't it? I think of OnPush similar to you, it's just good practice anyway and creates nice decoupled components. But let's not forget that besides that it is basically a useless performance optimization in like 99,9% of use cases. If you are not reacting to some high-volume events like mouse-moves Angular is blazing fast anyway. For me there is nothing wrong to leave the changedetection as is in those cases - it certainly feels better than the workarounds to me.

Long but readable code is way better than too CLEVER short code that is hard to read and understand. Please stick with KISS because you will not maintain the web application in the future.

OnPush is just not practical to use, too many gotchas; you have to an Angular expert to make it work, even for simple use cases. Introducing ImmutableJs is too cumbersome, and NgRx brings a huge development overhead as well. Building a simple form shouldn't be that hard, the framework should make it trivial. My take on it is, unless you really need the performance, which in 99% of the cases you don't, stay away from it it's not worth it.

Very bad approach. You started the video without providing context or describing your code 👎

Async validators are cursed. I have a stepper component where each step contains form. So i need to validate the form when i press "next". And there's no good way to do it. 1) UpdateValueAndValidity returns void, so i can't pipe into the process. 2) Calling updateValueAndValidity does not immediately set form status into pending state, so in my scenario form is still in "valid" state because it was not yet validated => i can't say for sure if the process started or not So i need to do a hack, first calling updateValueAndValidity, then subscribing to a statusChange filtering "PENDING" status and taking exactly 1 value. Could've been replaced with just updateValueAndValidity returning Observable/Promise.

Is there a way that I can get rid off the subscription when I submit the form? (Eg.: this.clientService.addClient(this.form.value).subscribe(() => ...)) Great content btw