fix(frontend): resolve edit student navigation and signal timing issues

- Change edit button from <button> to <a> for proper routerLink binding
- Replace ngOnInit with effect() to handle input signal timing correctly
- The route param 'id' was not available during ngOnInit lifecycle

Fixes DEF-001: "Estudiante no encontrado" error when clicking edit

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Andrés Eduardo García Márquez 2026-01-08 08:41:14 -05:00
parent a9eea7e793
commit 32d895f78c
2 changed files with 13 additions and 10 deletions

View File

@ -1,4 +1,4 @@
import { Component, ChangeDetectionStrategy, signal, inject, OnInit, input } from '@angular/core'; import { Component, ChangeDetectionStrategy, signal, inject, input, effect } from '@angular/core';
import { Router, RouterLink } from '@angular/router'; import { Router, RouterLink } from '@angular/router';
import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms'; import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
import { MatIconModule } from '@angular/material/icon'; import { MatIconModule } from '@angular/material/icon';
@ -167,7 +167,7 @@ import { LoadingSpinnerComponent } from '@shared/index';
} }
`], `],
}) })
export class StudentFormComponent implements OnInit { export class StudentFormComponent {
id = input<string>(); id = input<string>();
private fb = inject(FormBuilder); private fb = inject(FormBuilder);
@ -186,12 +186,15 @@ export class StudentFormComponent implements OnInit {
saving = signal(false); saving = signal(false);
serverError = signal<string | null>(null); serverError = signal<string | null>(null);
ngOnInit(): void { constructor() {
// Use effect to react when route param 'id' becomes available
effect(() => {
const studentId = this.id(); const studentId = this.id();
if (studentId) { if (studentId && !this.isEditing()) {
this.isEditing.set(true); this.isEditing.set(true);
this.loadStudent(parseInt(studentId, 10)); this.loadStudent(parseInt(studentId, 10));
} }
});
} }
private loadStudent(id: number): void { private loadStudent(id: number): void {

View File

@ -84,13 +84,13 @@ import { CreditsPipe } from '@shared/pipes/credits.pipe';
</td> </td>
<td> <td>
<div class="actions"> <div class="actions">
<button <a
class="btn btn-icon btn-ghost" class="btn btn-icon btn-ghost"
[routerLink]="['/students', student.id, 'edit']" [routerLink]="['/students', student.id, 'edit']"
matTooltip="Editar" matTooltip="Editar"
> >
<mat-icon>edit</mat-icon> <mat-icon>edit</mat-icon>
</button> </a>
<button <button
class="btn btn-icon btn-ghost" class="btn btn-icon btn-ghost"
[routerLink]="['/enrollment', student.id]" [routerLink]="['/enrollment', student.id]"