Angular 7 Reactive Forms : Issue in reseting validators and whole form contains

Question

I want to submit and reset a form after validation .

validation and submition and init of inputs values works good, but validators won't be reseted.

here is the result after form submittion

Register the control in the template :

    <form [formGroup]="createSeanceForm" #formDirective="ngForm"  class="needs-validation" (ngSubmit)="createSeance(createSeanceForm, formDirective)">

My input and how i show errors :

<div class="col-sm-12 ">
       <div class="form-group" [ngClass]="{
            'has-success': (submitted  || f.date.touched || f.date.dirty) &&  f.date.valid ,
            'has-danger': (submitted || f.date.touched || f.date.dirty) &&  f.date.invalid
                                                                        }">
           <input type="datetime-local" class="form-control" formControlName="date" placeholder="Date de la visite">
       </div>

     <div *ngIf="submitted && f.date.errors" class="invalid-feedback">
       <small class="text-danger ml-3 my-1" *ngIf="f.date.errors.required">Merci de renseigner ce champ !</small>

    </div>

My imports :

 import { FormBuilder, FormGroup, Validators, FormGroupDirective } from '@angular/forms';

My constructor and formGroup declaration:

createSeanceForm: FormGroup;

    constructor( 
    ...
        private formBuilder: FormBuilder
        ) { 
           
           
          this.initSeanceForm();

        }

My InitForm :

initSeanceForm() {
    this.createSeanceForm = this.formBuilder.group({
    date: ['', Validators.required],
    act: ['', Validators.required],
    doctor: ['', [Validators.required]],
    price: ['',],
    teeth: ['',]
    //teeth: ['', [Validators.required]]
});
  }

  get f() { return this.createSeanceForm.controls; }

Submit and reset Function

 createSeance(myForm, formDirective: FormGroupDirective){    

      this.submitted = true;
        
      // stop here if form is invalid
      if (this.createSeanceForm.invalid) {
          return;
      }else{
     TODO : API stuff.

       formDirective.resetForm();
       this.createSeanceForm.reset();
       this.createSeanceForm.markAsPristine();
       this.createSeanceForm.markAsUntouched();

        $('#addSeanceModal').modal('hide')
    }