⚡Angular 17 Nested Routes for Beginners Part 2 | Angular 17 Child Routes for Beginners | Angular 17
ฝัง
- เผยแพร่เมื่อ 3 ธ.ค. 2024
- ⚡Angular is a web framework that empowers developers to build fast, reliable applications.
⚡Maintained by a dedicated team at Google, Angular provides a broad suite of tools, APIs, and libraries to simplify and streamline your development workflow.
⚡Angular gives you a solid platform on which to build fast, reliable applications that scale with both the size of your team and the size of your codebase.
⚡Angular 17 has just been released. In this step by step tutorial, You will learn How to create Nested or Child routes in Angular 17 and display the Nested/Child components.
#angular17routingtutorial #angular17nestedroutes #angular17childroutes
#angular #angular17
#angularrouting #angular17nestedroutes
🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟
👇👇👇Check Out Part 01👇👇👇
⚡Angular 17 Routing For Beginners | Routing in Angular 17| Angular 17 Routing| Angular 17 Tutorial
• ⚡Angular 17 Routing F...
🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟
✨✨✨✨ Your Queries✨✨✨✨
angular 17,angular 17 tutorial,angular routing, angular 17 routing, angular 17 routing tutorial, angular 17 nested routes, angular 17 child routes,routing in angular 17,routing in angular,angular 17 routing tutorial,routing angular 17,routing angular,angular 17 tutorial,routing in angular,routing angular,angular 17 projects for beginners
✨✨✨✨✨✨✨✨✨✨✨✨
👉Check my Blog :
phpnodetuts.in
🌟 Support my work 🌟
👉 Support me by buying a Super Thanks💰
👉 On BuyMeACoffee: www.buymeacoff...
👉 Buy Affordable Hosting : bitli.in/5s35wr2
🔔 Subscribe for more tutorials just like this🔔
www.youtube.co...
*************************************************
Also check other videos
*************************************************
⚡Angular 17 Routing For Beginners | Routing in Angular 17| Angular 17 Routing| Angular 17 Tutorial
• ⚡Angular 17 Routing F...
⚡Angular 17 Dark Mode using Bootstrap 5, Signal and Local Storage
• 🤯Angular 17 Dark Mode ...
⚡How to fetch Data from API in Angular 17 using Service | Fetch data from API in Angular |Angular 17
• ⚡How to fetch Data fro...
⚡Angular 17 Control Flow | Angular 17 New Features |Angular 17 Tutorial |Angular 17 New Control Flow
• ⚡Angular 17 Control Fl...
⚡Install Angular 17 In Windows 11 /Windows 10 | Angular 17 Tutorial | Install Angular 17 Tutorial
• ⚡Install Angular 17 In...
⚡How to install Tailwind CSS in Angular
• ⚡How to install Tailwi...
⚡How to create Characters And Words Counters using Angular
• 🔥🔥How to create Charac...
⚡Laravel 10 Contact Form |How to Send Email in Laravel using Gmail |Laravel Contact Form send Email
• ⚡Laravel 10 Contact F...
⚡Create Laravel Admin Panel using filament php
• ⚡Create Laravel Admin ...
⚡Single Page Application /SPA Using Laravel Breeze And Livewire 3 | Livewire 3 SPA
• ⚡Single Page Applicati...
⚡Laravel 10 Authentication using Laravel Jetstream
• ⚡Laravel 10 Authentic...
⚡How to install Node JS in Windows 11 | How to install Node JS in Windows 10 | Node JS Install
• ⚡How to install Node J...
⚡How to install Codeigniter4
• ⚡How to install Codeig...
⚡Laravel 10 Authentication(Register, Login, Change Password, Verify Email)using Laravel Breeze
• ⚡Laravel 10 Authentica...
⚡Laravel Livewire 3 Image CRUD Tutorial Step By Step
• 🔥Laravel Livewire 3 Im...
⚡Laravel Livewire 3 Step By Step CRUD Tutorial
• ⚡Laravel Livewire 3 CR...
⚡How to install Livewire v3 in Laravel 10
• 🔥How to install Livewi...
⚡Best TH-cam Channels to Learn Web Development In Hindi
• 🔥🔥Best TH-cam Channel...
⚡How to install Wordpress on Windows 11
• 🤩How to install Wordpr...
⚡Best TH-cam Channels to Learn React Js
• 🔥🔥Best TH-cam Channel...
⚡Best TH-cam Channels to Learn Laravel
• 🔥🔥Best TH-cam Channel...
⚡Best TH-cam Channels To Learn Python, Django And Flask
• 🔥🔥Best TH-cam Channel...
⚡How To Deploy React App On Netlify For Free
• 🔥🔥How To Deploy React ...
⚡How To Install Xampp Server On Windows 11
• 🔥🔥How To Install Xampp...
⚡Best youtube channels to learn Angular
• ⚡20+ Best TH-cam cha...
![[ ออกกอง ] วัยหนุ่ม 2544 โลกหลังลูกกรง..ทัวร์กองถ่ายหนังใน "คุกของจริง" | JUSTดูIT.](http://i.ytimg.com/vi/vB--aOkZCpw/mqdefault.jpg)
👉Check my Blog :
phpnodetuts.in
🌟 Support my work 🌟
👉 Support me by buying a Super Thanks💰
👉 On BuyMeACoffee: www.buymeacoffee.com/phpnodetuts
👉 Buy Affordable Hosting : bitli.in/5s35wr2
Useful video and one of the few youtubers who had done video on the routes after angular 17 without module.ts file.
Congo🎉
Glad to hear that
just a question, I know in older versions of angular, you could make separate routing modules and then define the routes and the child routes in that separate directory, keeping the routes : Routes [ ] pretty short. How would one do this in the new angular? I mean make routes in a separate dir, and then use those routes PLUS the ones angular gives you from the get go
New suscriber.
Thanks for subscribing 😇
in case we need create spa with two language (English and french).
1- we will add at the beginning of every page the language bar that contain language icon (eng/ fr), click on it transform the website version to another language.
2- under the language bar there will be the nav bar.
3- at the page end there will be the footer
4- all english pages have same nav bar and footer.
5- all french pages have same nav bar and footer.
i will make two version from all pages, english version and french version.
the problem is i try make the nav bar and footer only two times (one for english version and other for french version), use them as shared components.
but i do not know how use them as shared components and in same time when click on language icon they also change to another version?
Est-ce possible d'avoir des vidéos sur comment sécuriser les routes, encore merci pour le contenu qui est très enrichissante
Thank you,please make more videos
Thank you
thanks u bro
You're welcome!🙂
You're doint a great job bro keep going.
and please make some .Net videos
Thanks and sure
Such a good video! Just one question.. do you know how to make scroll top when you click on a button? When I click on a button wich is on the bottom of the page, the page is still on bottom when I route to another link. Do you know how to fix it in angular 17?
Thank you!
Are you asking whether scrolling to the top is working when you click on the 'scroll to top' button? However, when you are at the bottom of the page and click on a link or route, for example, the contact page, the page opens, but you find yourself at the bottom of the page. Instead, you want the scrollbar to be at the top (in the Navbar).🤔
how route in modules?
❤
I'm working on a new project with Angular 17. I'm having some issues with my routes also I'm applying child/nested routes.
First in my navbar I call a component1, then, into component1 I have an anchor to call another component2.
localhost:4200/component1
localhost:4200/component1/component2/
Everything is working fine at this point, following your example.
The problem comes when I refresh the page and the URL address is refreshed to:
localhost:4200/
but still I have rendered the /component2
How can I keep the URL in the address bar... What's wrong?
I mean, if my site is in localhost:4200/component1/component2/ and then I refresh the page, how to keep the localhost:4200/component1/component2/ URL??
Hello David, are you using Node.js as a backend, or are you exclusively using Angular?
@@phpnodetuts Bro, thank you very much!! but after hours of debugging I found it was my mistake.
There were some HTML markup into my trying to be rendered by my RichTextEditor... It was a DEFAULT TEXT with URLs and jpg images into my ... so, that's why my mistake 😁
PS1: I'm trying to migrate an MVC NET UI to Angular 17.
PS2: 5 stars for your videos! (5/5)
-Regards from Monterrey, México! 🗺
@@dlerma1987 Gracias por tus amables palabras.😇
Can u share the git repo for code
Hello, I wanted to know if you can upload the HTML code of the 404 error code because it is not complete, please.
Check Example 03 👇
www.tailwindtap.com/blog/tailwind-css-404-page-samples
How to do nested routes load lazily
I will create a tutorial on this. Stay tuned.