Link to the source code you can find here github.com/DMezhenskyi/structural-directives-example Support the channel you can here bit.ly/donate-to-decoded-frontend
Oh i just wanna let you know, i just get a job as an Angular Dev at a tech company in my town. I learnt a lot from your video and i will always learn from you! Big Thanks 🤲🏼
@@DecodedFrontend May i make a suggestion? Can you maybe make a video or a series about how to do a plug-in system? Like with a core app and then extend it with some pluggable libs? I’ve tried to find some resources about that topic but haven’t found any good ones.
Hi Dmytro, amazing explanation again. Custom structural directives is not well explored topic and your video tutorial is by far the best! Just one proposal for a video series for a topic both interesting and poorly explained - Angular Interceptors! And more specifically, the case with JWT Token and Refresh Token handling. That is very tricky case - tackling the JWT with Refresh Token using Interceptors. How Interceptors work under the hood and what happens when we try to refresh our expired token and other requests are happening during that time. The mechanics of that case are tried to be explained here and there, but still they miss a lot of important details.
Great video Dmytro again! You have a great niche with Angular. Maybe you can cover some advanced topics related to Typescript? (Mapped Types, Discriminated union types, Decorators, State Machines, Generic Functions, Other type guards)
This video reminds me the NgTemplateOutlet directive which also can receive a context object and allows us to instantiate a ngTemplate with different arguments
This was informative. Not what i was looking for, but good. Was searching for context guards, for template typing. (my code just types everything as any)
Hi, Thank you for the feedback. I have a 3rd video in this video series which covers exactly what you were looking for 😉 You can check it out here - ua-cam.com/video/fsGzxyHi6yY/v-deo.htmlsi=px918hM12FPV2LPa
@@DecodedFrontend Yeah, it poped up today. But this thing, added with generics did the trick (and i already had a basic type guard, just didn't work propperly). Do you know how the @Input, even as a property or a signal, will translate into signals?
Hey Dmytro! Great video and explanation as always! What got me wondering is the fact that templates got rerendered after you mutated the context and not cloned it. I always thought that you need to rerender the whole template when you want to update the context but it seems like it's not necessary. I may need to revisit some of my code with templates to optimize template renderings 😁 Learned something new today, thanks!🙂 Btw a video on those template guards would be great, I've been trying to use them recently but did not figure 'em out yet...
Hi Alex, Haha, it was unintentional knowledge sharing, I didn't even think about cloning 😂 but I am happy that you could find something useful in the video :D
Thanks for the content! I was wondering why you create a instance of HideAfterContext class inside the directive itself instead of declaring as a dependency in the constructor? It was for simplicity or do you think that it's not relevant in this case to follow DI pattern?
It is ok to have it instantiated like this because context belongs to the template this directive operate with and makes no sense outside of it, so when directive object is destroyed the context for that directive will die as well. Also context it is not something what you should mock (e.g for unit test), so there is no much sense to use DI here.
Custom decorator not working in angular 12..it called the component ngOnInit(), instead of decorator ngOnInit()...can u explain about that... it's possible??
Yeah sure....I Created a new custom decorator ..it working fine in angular 9 but not working on angular 12...I searched for that issue some websites says angular 12 doesn't support Custom decorator..I debug tha code ...It will call the component ngoninit..not decorator ngOnInit
Awesome Content! Can we pass 'context' and 'context-props' as @Input from component where we want to use structural directive? If yes, is there any use cases of it?
Link to the source code you can find here github.com/DMezhenskyi/structural-directives-example
Support the channel you can here bit.ly/donate-to-decoded-frontend
Yeay!!! BRAND NEWS VIDEO
Thanks Dmytro
Oh i just wanna let you know, i just get a job as an Angular Dev at a tech company in my town. I learnt a lot from your video and i will always learn from you! Big Thanks 🤲🏼
Wow!!! congratulations, what's the awesome news 🎉I wish you all the best with your new Job 😉
@@krisnarusdiono1304 Congrats Krisna! All the best for you!!! Enjoy these videos!
Also waiting for 3rd video of overlay. You promised us that you will do a 3rd video on this topic with arrow buttons events with additional things
YESSS! Thank you Decoded
Отличный видос, ждем продолжение.
Awesome, thank you Dmytro
You are having very good knowledge of angular. Keep it up.
Thank you, I will
As always awesome video.
Glad you are doing Angular content and didn't jump on the React/Vue hype train.
I hope this never changes. ^-^
I am just trying to talk about things I know and worked with to not produce just shallow videos or doing the video version of official docs :)
@@DecodedFrontend May i make a suggestion? Can you maybe make a video or a series about how to do a plug-in system? Like with a core app and then extend it with some pluggable libs? I’ve tried to find some resources about that topic but haven’t found any good ones.
mentioning ngTemplateContextGuard and ngTemplateGuard_ would be really nice in this topic
The 3rd video in this series will dedicated exactly to those 2 guards ;)
This is some advanced stuff! Your channel is the best!
Thanks a lot!😊
Cool !!! Thank you dear friend !
You are welcome 😉
Wow! that's wonderful.
Thanks for great video. I knew ngTemplateOutlet syntax but today I understand how things works under the hood :)
Great man! Awesome second video. Can't wait the next one 😅
Hi Dmytro, amazing explanation again.
Custom structural directives is not well explored topic and your video tutorial is by far the best!
Just one proposal for a video series for a topic both interesting and poorly explained - Angular Interceptors!
And more specifically, the case with JWT Token and Refresh Token handling.
That is very tricky case - tackling the JWT with Refresh Token using Interceptors.
How Interceptors work under the hood and what happens when we try to refresh our expired token and other requests are happening during that time.
The mechanics of that case are tried to be explained here and there, but still they miss a lot of important details.
Great video!
Great video Dmytro again! You have a great niche with Angular. Maybe you can cover some advanced topics related to Typescript? (Mapped Types, Discriminated union types, Decorators, State Machines, Generic Functions, Other type guards)
angular directives is so powerful, awesome
Yeah, they are 😉
This video reminds me the NgTemplateOutlet directive which also can receive a context object and allows us to instantiate a ngTemplate with different arguments
Great Content
Amazing how you can explain the next-level Angular stuff! After every video, I am like, how can I use this technique.
Awesome video :)
Thanks for these great videos!! Please continue them forever!! :))
I'll do as long as possible :D
Ok so I know I have seen these on Angular docs website but I'm sure I didn't understand all that text without an example. Thank you!
Thank you! I am glad that could make it clearer for you :)
This is great, very clear.
Thanks for the video. Invaluable content for middle developers. All other channels are more focused for juniors while yours helps to improve further
thank you
HI! Can you create video about ngComponentOutlet, pros and cons?
Thanks for this great video
This was informative.
Not what i was looking for, but good.
Was searching for context guards, for template typing. (my code just types everything as any)
Hi,
Thank you for the feedback. I have a 3rd video in this video series which covers exactly what you were looking for 😉 You can check it out here - ua-cam.com/video/fsGzxyHi6yY/v-deo.htmlsi=px918hM12FPV2LPa
@@DecodedFrontend Yeah, it poped up today. But this thing, added with generics did the trick (and i already had a basic type guard, just didn't work propperly).
Do you know how the @Input, even as a property or a signal, will translate into signals?
Thank bro. I like it ❤️❤️❤️
I'm glad you like it
Hey Dmytro! Great video and explanation as always!
What got me wondering is the fact that templates got rerendered after you mutated the context and not cloned it.
I always thought that you need to rerender the whole template when you want to update the context but it seems like it's not necessary.
I may need to revisit some of my code with templates to optimize template renderings 😁
Learned something new today, thanks!🙂
Btw a video on those template guards would be great, I've been trying to use them recently but did not figure 'em out yet...
Hi Alex,
Haha, it was unintentional knowledge sharing, I didn't even think about cloning 😂
but I am happy that you could find something useful in the video :D
Hi, can we have HttpModule do something like react-query? I mean with state management just like react-query.
Cool
Thanks for the content! I was wondering why you create a instance of HideAfterContext class inside the directive itself instead of declaring as a dependency in the constructor? It was for simplicity or do you think that it's not relevant in this case to follow DI pattern?
It is ok to have it instantiated like this because context belongs to the template this directive operate with and makes no sense outside of it, so when directive object is destroyed the context for that directive will die as well. Also context it is not something what you should mock (e.g for unit test), so there is no much sense to use DI here.
❤
Custom decorator not working in angular 12..it called the component ngOnInit(), instead of decorator ngOnInit()...can u explain about that... it's possible??
Hi Bala,
I am not sure I understood what do you mean. Could you maybe rephrase it?
Yeah sure....I Created a new custom decorator ..it working fine in angular 9 but not working on angular 12...I searched for that issue some websites says angular 12 doesn't support Custom decorator..I debug tha code ...It will call the component ngoninit..not decorator ngOnInit
Awesome Content! Can we pass 'context' and 'context-props' as @Input from component where we want to use structural directive? If yes, is there any use cases of it?
hello sir, how to set value to variable for *myDirective="let someVariable" and use it {{someVariable}} like in material table
ezz :)
How can we use @HostListener() in structural directives?
You are having very good knowledge of angular. Keep it up.