I really enjoy your angular series or let's say the topics you cover! So, thanks for uploading and keep up the good work.. What topics do you plan in the future?
Thank you for the video! How do you get the package size to show up next to your imports? 7:12 you're importing observable and map. How are you getting that to show? TIA
Hi, I appreciate you make content on topics which are not common and hardly touched by other online video creators. For example Udemy Course in Angular Material Theming. Which I have purchased, watched and implemented in a real projects. Can I request you to create a similar course on CDK and its possibilities? Please let me know if I can help you in any way like (creating sample components which you might need in the course ) etc. Hoping to hear a response from you. Thanks Vivek
bitter apple hi! Thank you for a feedback:) could you please provide some reproducible example somewhere on stackblitz as example? Because it is hard to say where is the issue without seeing the code. Meanwhile check please if your origin element has also css property position:relative Because otherwise z-index doesn’t work
@@DecodedFrontend I have the same problem, I share the link of stackblitz, my case is a sidenav that I want that the backdrop to be fullscreen, because it is an internal element in many levels, the class that have the z-index I call it over_element stackblitz.com/edit/angular-ivy-m9zhw2?file=src%2Fapp%2Fapp.component.html thank you
Thank you for this great tutorial! I am using a slight modification of the connected overlay, and i need to insert material-datepickers inside of the ng-template. But when i do, the dropdown appears in the top-left of the screen. Any ideas on why this is happening? My z-index for the cdk is set to 9999.
Hey I would like to know how to handle the mat-select-panel overlay? Because as I am selecting values from drop-down mat-select-panel position changes according to value I select similarly mat-select-panel width is greater than the select box
Hi! :) Thanks for your question. I would be happy to help you but could you please clarify how exactly do you want to handle mat-select-panel. Do you want just to fix the width of the panel?
@@DecodedFrontend I want to fix the width of mat-select-panel for single select as well for multi select and also want to fix the position of selected values when I will select some value, suppose index 2 value and close the drop-down and next time when I will open drop-down then the popover of mat-select-panel goes upward
alright, I think I've got it. The width you can restrict by providing you custom CSS class into panelClass property of . So it would look like this: . Then somewhere in styles.scss file just define the width for .your-custom-class. Regarding the thing that "mat-select-panel goes upward" - try to apply property disableOptionCentering to mat-select like this:
thanks for the detailed video. i have requirement : table with multiple columns and some of the columns have search filter (when i click on the search filter column i need to show the popup with search input filter and multi select list ) . could you help me how to do this
![Angular CDK - Portal Module [Advanced, 2021]](http://i.ytimg.com/vi/wPjVWeXSdqU/mqdefault.jpg)
![Angular CDK - Layout tutorial (BreakpointsObserver & Platform/Browser detection) [Angular 10, 2020]](/img/n.gif)
🔥🔥🔥I just released one of the most advanced courses about Angular Forms. Check it out: bit.ly/advanced-angular-forms🔥🔥🔥
Really like your videos on Angular, it is so nice to see someone go beyond the endless "50min intro to Angular". Keep up the good work.
Thanks a ton!
Thanks for posting . Can we migrate this to recent angular version?
Great course. Very informative. Thanks.👍
Can you make detail video on rxjs. It will quite help
I really enjoy your angular series or let's say the topics you cover! So, thanks for uploading and keep up the good work.. What topics do you plan in the future?
Hi, Thanks for your feedback!
I plan Angular CDK, NgRx, NX Workspaces and some another smaller topics :)
Hello,
Thanks for this video.
Please how to connect the overlay width to the overlay origin width to have something responsive.
pls make a video of angular ComponentFactoryResolver or resolveComponentFactory()
Any videos on micro-frontend in angular.. ?
keep going bro ur a life saver
Very usefull video, Thank you!
Thank you for the video! How do you get the package size to show up next to your imports? 7:12 you're importing observable and map. How are you getting that to show? TIA
Hi Jestin,
I use this plugin for VS Code marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost :)
Hi, I appreciate you make content on topics which are not common and hardly touched by other online video creators. For example Udemy Course in Angular Material Theming. Which I have purchased, watched and implemented in a real projects.
Can I request you to create a similar course on CDK and its possibilities? Please let me know if I can help you in any way like (creating sample components which you might need in the course ) etc.
Hoping to hear a response from you.
Thanks
Vivek
hey great video but when i try to apply the z-index for my origin element, it continues to appear behind the backdrop. Could you kindly help? Thanks!
bitter apple hi! Thank you for a feedback:) could you please provide some reproducible example somewhere on stackblitz as example? Because it is hard to say where is the issue without seeing the code. Meanwhile check please if your origin element has also css property position:relative
Because otherwise z-index doesn’t work
@@DecodedFrontend I have the same problem, I share the link of stackblitz, my case is a sidenav that I want that the backdrop to be fullscreen, because it is an internal element in many levels, the class that have the z-index I call it over_element stackblitz.com/edit/angular-ivy-m9zhw2?file=src%2Fapp%2Fapp.component.html
thank you
I could solve it, it worked by changing the position: relative, and the sidebar component position: initial, try one of these
Thank you for this great tutorial! I am using a slight modification of the connected overlay, and i need to insert material-datepickers inside of the ng-template. But when i do, the dropdown appears in the top-left of the screen. Any ideas on why this is happening? My z-index for the cdk is set to 9999.
I have no idea to be honest :)
Hey, did you find the fix? Im using overlays inside an ng-for (multiple radio buttons), but the overlay displays in the top-left corner.
Hey I would like to know how to handle the mat-select-panel overlay? Because as I am selecting values from drop-down mat-select-panel position changes according to value I select similarly mat-select-panel width is greater than the select box
Hi! :) Thanks for your question. I would be happy to help you but could you please clarify how exactly do you want to handle mat-select-panel. Do you want just to fix the width of the panel?
@@DecodedFrontend I want to fix the width of mat-select-panel for single select as well for multi select and also want to fix the position of selected values when I will select some value, suppose index 2 value and close the drop-down and next time when I will open drop-down then the popover of mat-select-panel goes upward
alright, I think I've got it.
The width you can restrict by providing you custom CSS class into panelClass property of . So it would look like this: . Then somewhere in styles.scss file just define the width for .your-custom-class.
Regarding the thing that "mat-select-panel goes upward" - try to apply property disableOptionCentering to mat-select like this:
@@DecodedFrontend thank you😀
Лайк за Novopskov :D
Без Новопскова было бы не то :D
Киев тут :)
Привет киевлянам ;)
thanks for the detailed video.
i have requirement : table with multiple columns and some of the columns have search filter (when i click on the search filter column i need to show the popup with search input filter and multi select list ) . could you help me how to do this