Dynamic routes – wildcards and parameters

We want to change the function of the New Rep button so that instead of adding a rep to the entry, the user can actually edit the entry, opening the form with the data filled in.

First, let’s add a new method to the ExerciseSetsService service:

export class ExerciseSetsService {
 . . .
  updateItem(id: string, item: Partial<ExerciseSet>): Observable<ExerciseSet> {
    return this.httpClient.put<ExerciseSet>(`${this.url}/${id}`, item);
  }
  getItem(id: string): Observable<ExerciseSet> {
    return this.httpClient.get<ExerciseSet>(`${this.url}/${id}`);
  }
}

In addition to creating the new method by getting a specific item, we also prepared the update method to accept Partial of the ExerciseSet object.

The form for editing the diary entry will be the same as for adding a new entry, with the difference that it...