Angular 4 view is not updating when model is changed

Question

I have an Angular 4 component that retrieves data from a service and then updates a view. When my service retrieves the data and updates the component's property, the property does not update in the UI. I have tried using the NgZone and ChangeDetectionRef to force the update and neither worked. My view is:

<h1> {{ extractedData == false ? 'Enter' : 'Confirm'}} ACH Data</h1>
<form>
  <div class="form-group">
    <label>Account #</label>
    <input type="text" name="accountNum" [(ngModel)]="processedImage.achResponse.accountNumber" class="form-control"/>
  </div>
  <div class="form-group" *ngIf="!extractedData">
    <label>Confirm Account #</label>
    <input type="text" name="confirmAccountNum" [(ngModel)]="confirmAccountNumber" class="form-control" />
  </div>
  <div class="form-group">
    <label>Routing #</label>
    <input type="text" name="routingNum" [(ngModel)]="processedImage.achResponse.routingNumber" class="form-control" />
  </div>

  <button type="button" class="btn btn-lg btn-primary" style="border-radius: 0; margin: 1em; width: 90%">Submit</button>
</form>

And my Component is:

import { Component, OnInit, NgZone, ChangeDetectorRef } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Logger } from 'angular2-logger/core';

import { ProcessedImage } from '../../core/models/ProcessedImage';


import { ProcessedImageService } from '../../core/services/processedImage.service';


@Component({
  templateUrl: './payment-data.component.html',
  styleUrls: ['./payment-data.component.css']
})
export class PaymentDataComponent {

  public extractedData: boolean;
  public processedImage : ProcessedImage;
  public confirmAccountNumber: string;
  public headerText: string;

  constructor(private _route: ActivatedRoute,
              private _imgSvc: ProcessedImageService,
              private _log: Logger,
              private _cdRef: ChangeDetectorRef,
              private _zone: NgZone)
  {
    this.extractedData = false;
    this._log.info("initializing PaymentData component");

    this.processedImage = new ProcessedImage();
    this.confirmAccountNumber = "";


    this._route.paramMap.subscribe((m) => {
      let trx = m.get("transactionId");
      if (trx != null) {
        let img = this._imgSvc.get(trx);

        this._log.info("Image Received from svc", img);

        if (img != null) {
            this._log.info("Image is not null, updating stuff.");
            this.extractedData = true;
          this.processedImage = img;
        }

      }
    });
  }

  public getHeader() {
    return this.extractedData ? "Confirm" : "Enter";
  }

}

And this is what the output looks like.

Something is obviously broken because event the H1 static content does not show up. The expected result is that the fields should have string values in them and the title should say Confirm ACH Data. This is what the page looks like when I refresh (the _imgSvc wouldn't be able to find the transaction so "extracted" would be false). This leads me to believe it is something to do with routing, but the log entries all indicate that the constructor pieces are being called properly and returning the right data when the router brings you to this page. This is a child route as well, if that makes a difference.