Angular 2: formGroup expects a FormGroup instance. Please pass one in

Your patientForm is undefined until the patient in the subscription is populated. As such, you’re trying to bind to a value that doesn’t exist in the template at the time the template is parsed.

Add an *ngIf to render the form only when patient is truthy, or the form group is instantiated:

<section class="CreatePatient">
    <form *ngIf="patient" [formGroup]="patientForm" (ngSubmit)="onSubmit()">
        <div class="row">
            <div class="form-group col-12 col-lg-3">
                <label for="firstName">First Name</label>
                <input formControlName="firstName" type="text" class="form-control" id="firstName" >
            </div>

        <div class="row">
            <div class="col-12 col-lg-2">
                <button type="submit" name="submit" class="btn btn-block btn-primary">Save</button>
            </div>
        </div>
    </form>
</section>

When the patient is populated in the subscription, the patientForm instance will exist and the binding will work. It’s a common “gotcha” when dealing with async values.

Forms don’t always have starting values, so you can also check for the existence of the form itself:

<form *ngIf="patientForm" [formGroup]="patientForm" (ngSubmit)="onSubmit()">

The important part is that the form isn’t rendered until its instantiated.