Collect Date and Time on a Reactive Form

I'm developing a reactive form in Angular 5 and would like to store the Date / Time in a DateTime. In this case, the user should somehow inform the date and time of a specific event. However, I have not found a way to store this data directly in the view. Has anyone ever experienced this? What was the solution adopted?

I'm doing something that looks like a gambiarra. I created the dateTime in formBuilder and put it as input hidden in the view. Then I put a timepicker and a datepicker, together the two in the component and step through ngModel to the dateTime. It seems kind of like gambiarra, so I would like to find other ways to solve this.

In HTML, I did it this way:

  <div class="row">
    <div class="input-field col s6 m6 l6">
      <input materialize="pickadate" type="text" class="datepicker" placeholder="Selecione a Data" [materializeParams]=datePickerParams
        [(ngModel)]="data" (ngModelChange)="atualizaData($event)" [ngModelOptions]="{standalone: true}">
      <label> Data </label>
    </div>
    <div class="input-field col s6 m6 l6">
      <input materialize="pickatime" type="text" class="timepicker" placeholder="Selecione a Hora" [materializeParams]="[{twelvehour: false}]"
        [(ngModel)]="hora" (ngModelChange)="atualizaHora($event)" [ngModelOptions]="{standalone: true}">
      <label> Hora  </label>
    </div>
    <input type="hidden" formControlName="dataHora" [(ngModel)]="dataHora">

That is, I put two input with ngModel, one responsible for picking up the date and the other to pick up the time. So I'm putting it right after an input hidden that receives the dateHora, which I work on there in component.ts, concatenating with Moment.js:

  atualizaData($event) {
    this.dataHora = moment($event + ' ' + this.hora, 'DD/MM/YYYY HH:mm');
  }

  atualizaHora($event) {
    this.dataHora = moment(this.data + ' ' + $event, 'DD/MM/YYYY HH:mm');
  }

I do not know if this would be the best way to resolve this, the code got a bit dirty.