WIP

src/app/image-input/image-input.component.ts

@@ -0,0 +1,47 @@
+import { Component, inject } from '@angular/core';
+import { FormsModule, ReactiveFormsModule, UntypedFormBuilder } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatIconModule } from '@angular/material/icon';
+import { CommonModule } from '@angular/common';
+
+
+
+
+@Component({
+  selector: 'app-image-input',
+  imports: [
+    CommonModule,
+    MatButtonModule,
+    MatIconModule,
+    MatFormFieldModule,
+    MatInputModule,
+    FormsModule,
+    ReactiveFormsModule
+  ],
+  templateUrl: './image-input.component.html',
+  styleUrl: './image-input.component.scss'
+})
+export class ImageInputComponent {
+
+  fb = inject(UntypedFormBuilder);
+
+  editForm = this.fb.group({
+    photo: []
+  });
+
+
+  setFileData(event: Event): void {
+    const eventTarget: HTMLInputElement | null = event.target as HTMLInputElement | null;
+    if (eventTarget?.files?.[0]) {
+      const file: File = eventTarget.files[0];
+      const reader = new FileReader();
+      reader.addEventListener('load', () => {
+        this.editForm.get('photo')?.setValue(reader.result as string);
+      });
+      reader.readAsDataURL(file);
+    }
+  }
+}
+