Change field parent bind.

src/accounts/accountEditModal.component.ts

@@ -14,11 +14,11 @@ import { Account } from './account';
 </div>
 
 <div class="modal-body" id="modal-body">
-  <account-form [(account)]="account" (onFormChanged)="accountForm = $event"></account-form>
+  <account-form [(account)]="account" (onValid)="valid=$event"></account-form>
 </div>
 
 <div class="modal-footer">
-  <button class="btn btn-primary" [disabled]="!accountForm?.form.valid" (click)="submit()">
+  <button class="btn btn-primary" [disabled]="!valid" (click)="submit()">
     Save
   </button>
 
@@ -31,7 +31,7 @@ import { Account } from './account';
 export class AccountEditModalComponent {
   @Input() account: Account;
 
-  accountForm: NgForm;
+  valid: boolean = false;
 
   constructor(public activeModal: NgbActiveModal) {}
 

src/accounts/accountForm.component.ts

@@ -59,12 +59,12 @@ import { Account } from './account';
 })
 export class AccountFormComponent implements  AfterViewChecked {
   @Input() account: Account;
-  @Output() onFormChanged: EventEmitter<NgForm> = new EventEmitter<NgForm>();
+  @Output() onValid: EventEmitter<boolean> = new EventEmitter<boolean>();
   @ViewChild('form') form: NgForm;
 
   constructor() {}
 
   ngAfterViewChecked() {
-    this.onFormChanged.emit(this.form);
+    this.onValid.emit(this.form.form.valid);
   }
 }