#10.13 - Route Parameter Example - Routing - Angular Series

preview_player
Показать описание
In this video a full fledged example is done to display a list of employees and navigate to edit employee page based on a selected employee. This is implemented using Route Parameter feature in Angular.

===
===
export interface Employee {
id: number,
name: string,
salary: number,
gender: string
}

export const employees: Employee[] = [
{ id: 1, name: "John", salary: 4000, gender: "M"},
{ id: 2, name: "Smith", salary: 10000, gender: "M"},
{ id: 3, name: "Sophia", salary: 5000, gender: "F"},
{ id: 4, name: "Emma", salary: 9000, gender: "F"},
{ id: 5, name: "James", salary: 2000, gender: "M"}
];

===
Component Creation Commands
===
ng g c employee-list --skip-tests=true
ng g c edit-employee --skip-tests=true

Chapters
==
1. 00:00 - Router Parameter Example Walkthrough
2. 02:04 - Define Employee Data
3. 04:01 - Create Components
4. 04:55 - Define Routes and Links
5. 06:24 - Employee data in component
6. 07:05 - Employee List 'name' display
7. 08:37 - Employee List 'salary' display
8. 09:32 - Employee List 'gender' display
9. 10:13 - Employee List 'Edit' link
10. 11:54 - routerLink with parameter
11. 13:59 - Edit Employee 'name' field
12. 15:08 - Edit Employee 'salary' field
13. 15:35 - Edit Employee 'name' field
14. 16:18 - Edit Employee 'gender' field
15. 17:24 - Edit Employee Submit button and link
16. 18:42 - Sample employee data
17. 22:04 - Get route parameter value
18. 26:24 - Find employee and assign in component
19. 33:09 - Route Parameter Summary
Рекомендации по теме
Комментарии
Автор

Hello Sir,
Herein we are modifying the employee data by property binding, what is to be done to permanently modify the employee data with the values given in edit-employee page?

thulasiram