edit-project.component.ts

import { Component, numberAttribute } from '@angular/core';
import { ProjectService } from '../services/project.service';
import {ActivatedRoute, Router} from '@angular/router';

@Component({
  selector: 'app-edit-project',
  templateUrl: './edit-project.component.html',
  styleUrl: './edit-project.component.css'
})
export class EditProjectComponent {
  id : number;
  name: string = '';
  description: string = '';
  owner: string = '';
  date: string = '';
  category: string = '';
  url: string = '';
  file: File[] = [];
  goal: number = 0;
  currentAmount: number = 0;
  categories: any = []

  constructor(private projectService: ProjectService, private route: ActivatedRoute, private router: Router) {
    this.id = this.route.snapshot.params['id'];
    this.projectService.getProject(this.id).subscribe((data : any) => {
      this.name = data.name;
      this.description = data.description;
      this.owner = data.owner;
      this.date = data.date;
      this.category = data.category;
      this.url = data.url;
      this.goal = data.goal;
      this.currentAmount = data.currentAmount;
    }, error => console.error());
   }


  ngOnInit() {
    this.projectService.getCategories().subscribe((data: any) => {
      this.categories = data;
    });
  }

  onFileUploaded(event: Event): void {
    const input = event.target as HTMLInputElement;
    if (input && input.files && input.files.length) {
      for (let i = 0; i < input.files.length; i++){
        this.file.push(input.files[i]);
      }
    }
  }

  updateProject() {
    this.projectService.updateProject(this.id, {
      name: this.name,
      description: this.description,
      category: this.category,
      url: this.url,
      goal: this.goal,
      currentAmount: this.currentAmount
    }).subscribe({
      next: (data: any) => {
        if(this.file.length > 0){
          const formData = new FormData();
          this.file.forEach((file) => {
            formData.append('file', file, file.name);
          });
          this.projectService.newImages(data.id, formData).subscribe({
            next: () => {
              console.log('Images updated');
              this.router.navigate([`/details/${data.id}`]);
            },
            error: (error: any) => {
              console.error('Images update failure', error);
              this.router.navigate(['/error']);
            }
          });}
        this.router.navigate([``]);},
      error: (error: any) => {
        console.error('Project edition failure', error);
        this.router.navigate(['/error']);
      }

    });
  }


}