Não consigo pegar nem atribuir valores ao checkbox

Além do meu checkbox não iniciar marcado, o valor dele não altera quando eu marco ou desmarco. Fica sempre com o valor que eu atribuí no formBuilder:

Print da página do projeto

Photo-form.component.ts:

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

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

  photoForm: FormGroup
  constructor(private formBuilder: FormBuilder) { }

  ngOnInit() {
    this.photoForm = this.formBuilder.group({
      file: ['', Validators.required],
      description: ['', Validators.maxLength(300)],
      allowComments: [true]
    })
  }

  upload() {
    console.log(this.photoForm.getRawValue())
  }
}

Photo-form.component.html:

<div class="container">
  <form class="row" [formGroup]="photoForm" (submit)="upload()">
    <div class="col-md-6 text-center">
      <input
      type="file"
      accept="image/*"
      formControlName="file">
      <ap-vmessage
        text="A photo must be selected"
        *ngIf="photoForm.get('file').errors?.required">
      </ap-vmessage>
    </div>

    <div class="col-md-6"><section></section>
      <div class="form-group" >
        <textarea
          formControlName="description"
          class="form-control form-control-sm"
          placeholder="photo description">
        </textarea>
        <ap-vmessage
          text="The maximun length is 300"
          *ngIf="photoForm.get('description').errors?.maxlength">
        </ap-vmessage>
      </div>

      <div class="form-group">
        <label class="text-muted">
          Allow comments
          <input type="checkbox" formGroupName="allowComments">
        </label>
      </div>

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


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

Outra coisa, o uso de ponto e vírgula é obrigatório no TS? Sempre esqueço de por, mas nunca deu problema. Vi uma vez que era recomendado, mas gostaria de entender o porquê.

Consegui contornar esse problema fazendo de uma outra forma:

Primeiro, eu removi o checkbox do photoForm

  ngOnInit() {
    this.photoForm = this.formBuilder.group({
      file: ['', Validators.required],
      description: ['', Validators.maxLength(300)]
    })
  }

Depois criei um atributo chamado checkboxValue, com true sendo seu valor padrão:

export class PhotoFormComponent implements OnInit {
  checkboxValue = true;

Por fim, eu fiz algumas mudanças no checkbox pelo html do componente:

<input type="checkbox" [checked] = 'checkboxValue' (change) = 'checkboxValue = $event.target.checked'>

Quando a página é renderizada, um data binding é realizado entre o atributo checked do checkbox e o atributo checkboxValue que eu criei anteriormente. Desse modo, o checkbox inicia marcado.

Além disso, quando o evento change é disparado, ou seja, quando o checkbox é ativado ou desativado, o atributo checkboxValue recebe o valor do atributo checked.