How to save from an angular form to a server nodejs an image

I'm doing a web page with angle and nodejs , I want the workers that register have the option to save a profile picture, then I have a form of angular (ngForm) and such and I have put an input file for the upload, up there well.

On the frontend side

<style>
  mat-form-field {
    width: 60%;
    margin-bottom: 8px;
    font-size: 20px;
  }

  #botonera a {
    margin: 8px;
  }
</style>


<div class="col-lg-12">
  <h2 style="text-align: center">Creacion de empleado</h2>
</div>
<div class="col-lg-12" style=" text-align: center">


  <form #formulario="ngForm" action="" (ngSubmit)="insertarEmpleado()" ngForm>
    <div class="example-container">

      <mat-form-field hintLabel="">
        <input matInput #input maxlength="9" placeholder="DNI" pattern="(([X-Z]{1})([-]?)(\d{7})([-]?)([A-Z]{1}))|((\d{8})([-]?)([A-Z]{1}))"
          [(ngModel)]="empleado_nuevo.dni" name="dni">
      </mat-form-field>


      <!-- [ngModel]="empleado_nuevo.nombre" -->
      <mat-form-field hintLabel="">
        <input matInput #input type="text" placeholder="Nombre" pattern="[a-zA-Z\s]+" [(ngModel)]="empleado_nuevo.nombre" name="nombre">
      </mat-form-field>

      <mat-form-field hintLabel="">
        <input matInput #input type="text" placeholder="Apellidos" pattern="[a-zA-Z\s\-]+" [(ngModel)]="empleado_nuevo.apellidos"
          name="apellidos">
      </mat-form-field>

      <mat-form-field hintLabel="">
        <input matInput #input type="text" placeholder="Departamento" pattern="[a-zA-Z\s]+" [(ngModel)]="empleado_nuevo.departamento"
          name="departamento">
      </mat-form-field>

      <mat-form-field hintLabel="">
        <input matInput #input type="number" min="0" placeholder="Sueldo" [(ngModel)]="empleado_nuevo.sueldo" name="sueldo">
      </mat-form-field>

      <mat-form-field hintLabel="">
        <input matInput #input type="date" placeholder="Fecha de nacimiento" [(ngModel)]="empleado_nuevo.fecha_nacimiento" name="fecha_nacimiento">
      </mat-form-field>

      <div style="text-align: center" class="col-lg-12">
        <input type="file" placeholder="Imagen de perfil" [(ngModel)]="empleado_nuevo.imagen_perfil" name="imagen_perfil" style="margin:0 auto; width: 300px;margin-bottom: 45px;">
      </div>



      <!--======-->


      <div id="botonera">
        <button mat-raised-button color="primary" (click)="insertarEmpleado()">Enviar</button>
        <button mat-raised-button (click)="limpiarFormulario(formulario)">Limpiar</button>
      </div>




    </div>
  </form>
</div>

For the backend part I have the following:

The schema that this is trying to do is the following, which does not just compile well:

const mongoose = require('mongoose');
const {Schema,File} = mongoose;


const empleado_schema = new Schema({
    dni:{type:String,required:true, unique:true},
    nombre:{type:String, required:true},
    apellidos:{type:String, required:true},
    departamento:{type:String, required:true},
    sueldo:{type:String, required:true},
    fecha_nacimiento:{type:Date, required:true},
    imagen_perfil:{type:File,required:true}
});


module.exports = mongoose.model('tbEmpleadosss',empleado_schema);

As you can see there, what I try is that the image that the employee uploads when registering in the form is saved in nodejs for when his profile goes to his image, but that is another issue for now I want to save it.

• Is it correct to have the schema defined in this way, that is, with the field image type file or should it be of the string type so that it only saves the address where it is saved and by programming in time of execution itself? app upload it?

  • How could I upload the file correctly, I imagine that I would have to create a file in the app called images where I upload all the images?

  • What if I want each worker to have a profile picture and an indeterminate number of pictures as a kind of gallery, would I have to make an array of addresses in the schema?