To-Do List in Angular with source code in GitHub.

Подписаться 819

Просмотров 26 тыс.

50% 1

This to-do list application in Angular is using a template-driven approach with form control validations form.invalid and form.dirty
You can find the source code here:
github.com/katkovd73/to-do-li...
You can find the slides I was using in the video here:
github.com/katkovd73/Tutorial...
Links mentioned in the video:
Introduction to forms in Angular
angular.io/guide/forms-overview
Bootstrap form template
getbootstrap.com/docs/4.0/com...
Bootstrap table template
getbootstrap.com/docs/4.0/con...
Angular validators
angular.io/api/forms/Validators
Angular directive ngFor
angular.io/api/common/NgFor

Наука

Опубликовано:

19 дек 2022

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 40

@Sarmadfarhankhan Год назад

This is very good and easy to understand. I like the way you teach the stuff. Thanks a lot.

@dkprogramming Год назад

You are welcome.

@SusilVignesh 6 месяцев назад

Just wanted to say i completed this tutorial.. and it is really good and please keep up with the good work.. Thanks!

@dkprogramming 6 месяцев назад

Thank you! I appreciate it.

@mrx4256 10 месяцев назад

Great tutorial! Thank you for explaining each and every part..❤❤

@dkprogramming 10 месяцев назад

You are welcome!

@fairwildchicken5958 День назад

This is really helpful, very understandable and also deep. Thank you so much !

@dkprogramming 23 часа назад

You're so welcome!

@muniramirzoeva6656 12 дней назад

perfect explanation. Thanks

@dkprogramming 11 дней назад

Glad it was helpful!

@1988proxy 8 месяцев назад

thank you very very much for this tutorial!!!!!!

@dkprogramming 8 месяцев назад

You are welcome!

@Teju.0109 6 месяцев назад

Thank you for this tutorial. I'm new to Angular, & Learnt a lot. If we want to edit the existing task, how can we implement next to the delete button? Is there any option in bootstrap for edit? Thanks in advance 🙏

@dkprogramming 6 месяцев назад

You are welcome. There are a few ways you could implement the edit functionality. The easiest way is to add an Edit button to make the task editable. You would also need a Save button to save the new value into the array. It would all be done with Angular. Bootstrap is a framework that helps you make your app look good, saves you time to style your application. I got asked a few times about an Edit functionality. I will make a video about it and post it this weekend.

@NikyAriane Год назад

@DK Programming Your tutorial is really good and you explain very well. Can you please explain how to modify a task? Thank you very much

@dkprogramming Год назад

Thank you! I am glad you liked it. As for modifying a task, you would need to add a button with a click event that would pass the data for that particular task to a new page or a dialog popup. After you modify it, you would need to have a button with a click event that would save the modified task. Good luck!

@AlcoTube Год назад

Now I want to meet the cat 🐱in the background

@dkprogramming Год назад

She does interfere with the sound sometimes :-)

@TravelIdea99 Год назад

Amazing😍

@dkprogramming Год назад

Thank you!

@kokonaingmyanmar2917 8 месяцев назад

Can you share your angular power point slide. This lesson is easy to understand for me. 😃🤩

@dkprogramming 8 месяцев назад

I am glad the video was helpful. I saved the slides to GitHub. The link in the description of the video.

@supermous5393 6 месяцев назад

thank you sir

@dkprogramming 6 месяцев назад

You are welcome!

@user-bs8je3rg1j 5 месяцев назад

Hi sir in this we are using angular and bootstrap only right sir

@dkprogramming 5 месяцев назад

Hello! Yes, we are using Angular and Bootstrap (for styling) in this project.

@user-bs8je3rg1j 4 месяца назад

@@dkprogramming sir how to add a database in this please add this part also please

@ffotyk9938 Месяц назад

i love you so thank

@dkprogramming Месяц назад

Thank you!

@GauravJS10 3 месяца назад

which version of angular is used?

@dkprogramming 3 месяца назад

When I build it, it was Angular 14. Since the project is fairly simple, you can use any version of Angular. The only difference is, if you want to build it with Angular 17 and higher, when you generate a new project using CLI, don't generate it as a stand-alone components project. Instead of using "ng new todo" use "ng new todo standalone=false" and it will be structured exactly the same way as it was in the tutorial.

@GauravJS10 3 месяца назад

thank you @@dkprogramming