Angular 13 CRUD | Employee Management System | 2022 | Bootstrap 5 | Angular Project
HTML-код
- Опубликовано: 30 апр 2022
- About the Video--------------------------
In this video, I have built Employee Management System from Scratch.
For backend I have used Json-server which gives fake api for small applications.
I have also used Bootstrap 5 for this project.
Watch the Full video to know more.
Source Code Link ---------------------
github.com/rohan-ankalkote/YT...
Tags---------
#programming, #programmingtutorials, #tutorials, #frontend, #backend
#angular13, #angularcrud, #angularproject, #angular, #bootstrap5, #jsonserver, #websitedesign, #employeecrud, #employeemanagementsystem, #htmlcssjs
Maine 100 subscriber purey kr diye💣💥💥
Thanks bro!!
Hi Friend, I have learnt lot from this tut. Thank u very much. Keep doing this good work. God bless!
good work bro, it's an excellent video keep it up with these kind of videos.
Great tutorial many things I have learn after watching this your tutorial.love you bro with heart 💜
Nice project sir .... thank you
Gracias Mister Guy.... a pesar que no tiene subtitulos se entiende.....gracias
Very nice work
Good one
perfect your work thanks for project and that cod very useful
Nice tutorial bro thanks
Nice bhai
You're great
Great work ❤️ from 🇵🇰
best video
ty bro
Nice tutorial bro thanks but, agar hum external dusre location se image select kare to vo display honi chahiye iske liye kya karna padega
Hi sir please add full angular tutorial course from basics to advance
Can you please upload a video on *How to export data to CSV file in angular* if the data is coming from API
Or the data is coming from a method in html file like downloadfile ( data : IEmployee ) 🥲🥲🙏🙏
This video is very informative but its blur
Please post good quality video
Hello, i got net:ERR_connection refused while i get or post the details and also json localhost mot working what is the reason
Thanks for the tutorial sir. It helped me a lot. Hope to see more videos from you like this.
Sir Please do a video where we can send all the data to a database instead of using json-server
Example: Like Creating a rest api which can use to call the data.
Hope you can solve this issue
Need help
I was trying to run cmd for json server installation but it gives me some unauthorised ka error. Can you help me to solve it..?
Sir all the codeee are written as same but output doesn't display ,my form doesn't work clearform
why to delete data on click of edit instead of using patch?
good jobs but node js side save image ko show kaise kare iska short vdo bto
plzz help me .....
when I install json server then run it that time error occurs called db.json file not found how can fix this error
Hi, as i tried to do this project, but I'm not getting how to start it, I'm not getting from were you are copying the code from
Sir can you please tell me, how to add pagination?
stuck in file upload and retrieve by user id from MySQL and NodeJS
please replay
delete button is not working sir the code and logic is written as same as u written code
Good work. Downloaded and clone this project but not working. Displaying nothing on screen
i cloned the project run the server but when i want to upload empoyee, i get an error:
posts (failed) xhr zone.js:2680
posts (failed)net::ERR_CONNECTION_REFUSED preflight Preflight
hiii bhaiya, isme image mere file se page me so kyu nhi ho rhi h
kya jroori h pic ko asset me dlna page me show hone ke liye
Dear Rohan. Please guide us how to handle big data in angular. Suppose we have 10,000 employees then how we will load them in components and apply pagination and searching on it without compromising the loading speed of site.
You can create a component named Page,
This will have let us say 50 employees.
In bottom we will have next and prev buttons.
10000 employees can be inserted into 200 Page components.
I have uploaded a video on how to create dynamic components.
You can use that to destroy current Page component if we click next button, and create another Page component dynamically insert next 50 employees in it and display.
.
Instead of this u can use tables in angular material. It will do this for you.
@@programmer_rohan Thanks a lot dear
Bro I've been following this project and worked till the adding the functionality for delete button but on clicking the delete button, the template doesn't get delete itself. After pressing the delete button, the employee component doesn't delete itself I need to refresh the page after that only it deletes the component. How do I fix that?
If you have followed every step that i did it should delete. May be u r diaplying enployesfrombackend array rather than employestodiaplay
But when we are click on cancel icon the data getting lost
Please the tutorial you have created in reactive form please teach us how to store form data in local storage
why you want to store form data in local storage?
@@programmer_rohan just for learn how to use local storage please continue with reactive form
After clicking on edit button, in console error is showing like cannot read properties of null (reading 'setValue') what to do?
Object might be null. Look into that
Muzhe ek task Diya hai . But na. Wo kuch smjh me nhi aara kya ap help kr skte ho usme.. please
I got an error and cant figure it out..can i get your source code..!?
who is going to believe
that girl as pooja kumari and that guy as yash chauhan
it"s too funny
That's true MC BC
😂
how can we make the modal popup reusable so that it can be used in multiple components ?
Creat a separate component called CustomModal, and put model in that. And do all css styling on that custom modal same as they have done in bootstrap modal.
But this will be complicated, so there is in built modal in Angular material, u can use that.
how to save image in an folder after upload
Can any one tell me how can I add background image in this project?
I tried with header, employee and app component also but i couldn't.
Use css file of the component
Background-image: url("")
Bhai isme pura aapne jaisa kiya hai, step by step maine waisa hi kiya hai, but still image local par load nahi hora upload karne ke baad. Koi idea hai kya, kyu nahi ho raha hoga?
sir need backend for this project
Please help me out
Error in console
Failed to load resource
Hi sir i m create same project for CRM but json server is not working manually added dada in db.json file then it's working but by using add employee form data not save on server
Pls help me
Can you get the solution plz sharee
Yes I solved it..
@@bhaginathpayghan how
@@bhaginathpayghan you refer any vedios or other
@@Noufiya_Azeez watch this video carefully...all concept is clear in that video..
following though not understanding indi
Getting error in app header please help
bro i have installed json server..but also when i click insert button it is not showing details
please help me with this
I have shown every step in video. Please follow each and every step
Profile image is not loading can anyone help me?
Add and view difrent page then where to add *ngif="let data of employees "
Server data is show in console but my view page is fully blank after using *ngif
app-employee not working please help
Wish this was in english
How Create same Project without Json Server with Array of object with services?
Please reply or Make the video on same.
can you tell how can i run this project in my computer from your github link
Clone it
@@programmer_rohan code mae koi change Krna hoga?
@@umang2049 nahi
Maine ek form bna rakhi hai ussi form ko mujhe use krna hai. Ad bhi data ussi form se ho rha hai. Toh mujhe chahiye ki dubara form nhi banana pde usi form ko use kr skte h hum kisi button ke click pe
Wo form ko copy karo modal ne jise maine banaya hain video me
Erro in :
addEmployee(){
let employee: Employee = {
education: this.educationOptions[parseInt(this.Education.value)],
}
}
(property) Employee.education: string
Type '{ title: string; }' is not assignable to type 'string'.ts(2322)
employee.model.ts(7, 3): The expected type comes from property 'education' which is declared here on type 'Employee'
Bhai need angular 14 project on human resource management system,please.......................
Mee to needed bhayya in angular 14 on HRMS
I cloned this project but posts records not showing in browser & also not able to see newly added record plz help
Download json server
@@programmer_rohan yah i downloaded that but showing this error -
WebSocket connection to 'ws://localhost:4401/ng-cli-ws' failed:
Hii bro How I upgrade this project to Single page application ..
This is single page application
@@programmer_rohan 😄
can i make this in angular 16
Yes
if you close the button after edit the record gets deleted and also if u edit the previous image gets deleted ... this project has many flaws .
1st point is correct (but video needs to be short so i skipped it)
2nd point is wrong, image is not deleted
Can you please help me with it
bro I how to connect you
I need your help
I want to learn angular from you...
How can I help you?
@@programmer_rohan I need crud operation using sts, MySQL and angular
Could you please help me with this
@@keshav2kumar sts?
You can use Entoty Framework Core
Rohan 🚫 mc stand 👍
Voice 😅
I am stuck can u please help
localhost:3000 cant open
source code ?
github.com/rohan-ankalkote/YT-2022-05-EmployeeCRUD
Show,
bro
this is not the way of explantion
because the way you explained this can be only understood by good knowledge people
what about remaining peoples
see bro
what ever you explain clearly you should explain A to Z
that is the way of explanation
OK
Bro detail me btao skip mat kro😅
kya
@@programmer_rohan jo class use kr rhe ho uski info wapas search karni padti hai
speak English
see bro don't do this kind of off off work
if you want to do clearly in undarstandable formate do
or else don't do
i am disappoined
you have knowlege
but you don't know how make vidoes
What?
add employee data not shown in the dashboard after install JSON server and every step perform in the console there are show the error message like (R HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: 'Unknown Error', URL: 'localhost:3000/posts', ok: false, …}) looking forward to your response
Same problem
Hi profile waale part ki vajah se edit me problem aari hai
profile: this.fileInput.nativeElement.files[0]?.name,
Jab mai add employee karne ja raha hu to- POST localhost:3000/posts 500 (Internal Server Error) de raha hai.
Iska solution kya hai?
Json server install karo
@@programmer_rohan already install kar liya hai but error de raha hai. Firebase se connect kar k use kar rahe hai to work kar raha hai.
@@programmer_rohan ERROR TypeError: res is not iterable,... now this error also coming in getEmployees() method.
@@MDZAKIR-rm4vi res ko res: any aisa likho
@@programmer_rohan tried, but not works