test

frontend/allowance-planner-v2/src/app/pages/tasks/tasks-routing.module.ts

@@ -6,6 +6,10 @@ const routes: Routes = [
   {
     path: '',
     component: TasksPage,
+    children: [
+      { path: 'add', loadChildren: () => import('../edit-task/edit-task.module').then(m => m.EditTaskPageModule) },
+      { path: 'edit/:id', loadChildren: () => import('../edit-task/edit-task.module').then(m => m.EditTaskPageModule) }
+    ]
   }
 ];
 

frontend/allowance-planner-v2/src/app/pages/tasks/tasks.page.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { TaskService } from 'src/app/services/task.service';
 import { Task } from 'src/app/models/task';
+import { ActivatedRoute, Router } from '@angular/router';
 
 @Component({
   selector: 'app-tasks',
@@ -12,16 +13,22 @@ export class TasksPage implements OnInit {
   public tasks: Array<Task> = [];
 
   constructor(
-    private taskService: TaskService
+    private taskService: TaskService,
+    private router: Router,
+    private route: ActivatedRoute
   ) {}
 
   ngOnInit(): void {
+    this.getTasks();
+  }
+
+  getTasks() {
     this.taskService.getTaskList().subscribe(tasks => {
       this.tasks = tasks;
     });
   }
 
   createTask() {
-    this.taskService.createTask({ name: 'Created task', reward: 10, assigned: 1 });
+    this.router.navigate(['edit', 1], { relativeTo: this.route });
   }
 }