`ngSubmit` - no funciona como se esperaba

Estoy usando angular5, la forma se ve así:

<div class="box-body">
    <form novalidate #formRef="ngForm">
        <div class="row">
            <div class="col-sm-6 form-group">
                <label>First name</label>
                <input type="text" class="form-control" name="firstName" ngModel #firstNameRef="ngModel">
            </div>
            <div class="col-sm-6 form-group">
                <label>Last name</label>
                <input type="text" class="form-control" name="lastName" ngModel #lastNameRef="ngModel">
            </div> 
        </div>
        <button type="submit" class="btn btn-secondary" (ngSubmit)="onSubmit(formRef.value)">Submit</button>
    </form>
</div>

La clase se ve así:

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

interface User {
  firstName: string;
  lastName: string;
}

@Component({
  selector: "registration-form",
  templateUrl: "./registration-form.component.html"
})

export class RegistrationFormComponent {
  onSubmit(formValue) {
    alert('hi')
    console.log(formValue);
  }
}

Pero cuando completo los datos en la entrada, y no envío nada a las consolas. también la alerta no se llamó en absoluto. ¿Falta algo aquí? que alguien me ayude

Demostración en vivo