title: How to send images in fields of a form group?
body: <p>I have a form group where I need to send two images in the profile_pic and banner_pic fields. However, all the ways that having sent the server returns me an error message stating that the values entered in the fields must be of type file.</p>
  
  <pre><code>handleBanner(file: File) {
      this.fileBanner = file;
      const reader = new FileReader();
      reader.onload = (event: any) =&gt; {
         this.eventForm.patchValue({
          banner_pic: reader.result
       });
  
       this.urlPreviewBanner = event.target.result;
      }
       reader.readAsDataURL(file); 
  }
  
  &lt;div class="col s1"&gt;
              &lt;label for="selecionarFotoBannerEvento" style="cursor:pointer;"&gt;
                &lt;img [src]="urlPreviewBanner"
                     alt=""
                     class="responsive-img"
                     width="800"/&gt;
              &lt;/label&gt;
            &lt;/div&gt;
            &lt;div class="col s9"&gt;
              &lt;label for="selecionarFotoBannerEvento" style="cursor:pointer;"&gt;
                &lt;p class="titulo-selecao-foto"&gt;&amp;nbsp; Adicionar banner do evento&lt;/p&gt;
                &lt;p class="legenda"&gt;Recomendado imagens com tamanho 800x150.&lt;/p&gt;
                &lt;input formControlName="banner_pic" name="bannerHidden" type="hidden"&gt;
                &lt;input 
                       (change)="handleBanner($event.target.files[0])"
                       type="file"
                       accept="image/*"
                       id="selecionarFotoBannerEvento"
                       style="display: none"/&gt;
              &lt;/label&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Currently I can display the image in preview but at the time of submitting the response the server remains stating that the values need to be of the file type.</p>