Aula 01 - Validação: Meu form não mostra as mensagens de erro

Olá, estou com problemas na validação do meu form.

A aplicação não entra na tag app-vmessage. Nenhuma validação está sendo feita, exceto a do button (uploadPhotoForm.invalid).

A conexão entre os 2 arquivos está sendo feito, pois os valores padrões estão sendo replicados no html, mas não aplica as validações.

Outra dúvida que tenho: porque a linha *ngIf="uploadPhotoForm.get('file').errors?.required" fica sempre sublinhada, como se estivesse com erro ?

PHOTO-FORM-MODULE:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { PhotoFormComponent } from './photo-form.component';
import { ReactiveFormsModule } from '@angular/forms';
import { VmessageModule } from 'src/app/shared/components/vmessage/vmessage.module';

@NgModule({
  imports: [
    CommonModule,
    ReactiveFormsModule,
    VmessageModule
  ],
  declarations: [
    PhotoFormComponent
  ],
  exports: [
    PhotoFormComponent
  ]
})
export class PhotoFormModule { }

PHOTOS MODULE:

import { NgModule } from '@angular/core';

import { PhotoModule } from './photo/photo.module';
import { PhotoPrincipalModule } from './photo-principal/photo-principal.module';
import { PhotoFormModule } from './photo-form/photo-form.module';
import { VmessageModule } from '../shared/components/vmessage/vmessage.module';

@NgModule({
  imports: [
    PhotoModule,
    PhotoFormModule,
    PhotoPrincipalModule
  ]
})
export class PhotosModule { }

HTML:

<div class="container">
  <form [formGroup]="uploadPhotoForm" class="row">
    <div class="col-md-6 text-center">
      <input
        formControlName="file"
        type="file"
        accept="image/*">
      <app-vmessage
        text="Selecione um arquivo..."
        *ngIf="uploadPhotoForm.get('file').errors?.required"
      ></app-vmessage>
    </div>

    <div class="col-md-6">
      <div class="form-group">
        <textarea
          formControlName="photoDesc"
          placeholder="Fale mais sobre a foto..."
          class="form-control form-control-sm"
        ></textarea>
        <app-vmessage
        text="Tamanho máximo é de 30 caracteres"
        *ngIf="uploadPhotoForm.get('photoDesc').errors?.maxlength"
      ></app-vmessage>

      </div>

      <div class="form-group">
        <label class="text-muted">
          Allow comments
          <input
            type="checkbox"
            formControlName="photoComments"
            class="form-control form-control-sm">
        </label>
      </div>

      <button
        [disabled]="uploadPhotoForm.invalid"
        type="submit"
        class="btn btn-primary btn-block">
        Upload
      </button>

      <a class="btn btn-secondary btn-block">Cancel</a>
    </div>
  </form>
</div>

COMPONENTE:

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';

@Component({
  templateUrl: './photo-form.component.html'
})
export class PhotoFormComponent implements OnInit {

  uploadPhotoForm: FormGroup;

  constructor( private formBuilder: FormBuilder ) { }

  ngOnInit() {
    this.uploadPhotoForm = this.formBuilder.group ({
      file: [ '', Validators.required ],
      photoDesc: [ 'blá blá blá', Validators.maxLength(30) ],
      photoComments: [ true ]
    });

  }

}