I am currently working on a page where I need to display and edit specific user information at /users/524.json. However, I also want to include the working days from another table on the same page. I have provided most of the code below for reference. Unfortunately, I am unable to deploy it on "StackBlitz" at this time. The main issue seems to be with the " loadWorkingDays" function. Could you please take a look and advise on what needs to be fixed?
HTML:
<div class="card">
<table>
<thead>
<tr>
<th>Working Days</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let workingDay of filteredWorkingDays" >
<td>{{workingDay.date}}</td>
</tr>
</tbody>
</table>
</div>
TS:
...
users: Array<User>;
workingDays: Array<WorkingDay>;
id: number;
routeId: any;
returnUrl: string;
public errorMsg;
filteredWorkingDays = [];
constructor(
private authTokenService: Angular2TokenService,
private route: ActivatedRoute,
private router: Router,
private servUser: UserService,
private servWorkingDay: WorkingDayService,
) {
this.workingDays = new Array<WorkingDay>();
this.users = new Array<User>();
}
@Input() workingDay: WorkingDay;
@Input() user: User;
ngOnInit() {
this.loadWorkingDays();
this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/users';
this.routeId = this.route.params.subscribe(
params => {
this.id = +params['id'];
}
)
let userRequest = this.route.params
.flatMap((params: Params) =>
this.servUser.getUser(+params['id']));
userRequest.subscribe(response => this.user = response.json(), error => this.errorMsg = error);
}
private loadWorkingDays() {
let filteredWorkingDays = this.workingDays;
if (this.servWorkingDay) {
this.servWorkingDay.getWorkingDays().subscribe(workingDay => this.workingDays = workingDay);
}
this.filteredWorkingDays = this.workingDays.filter((workingDay) => workingDay.w_user_id == this.user.user_id);
}
...