Get property undefined error on defined property

I am having quite a bit of trouble wrapping my head around why this is occurring. I am trying to take user input in a form and submit it to my database, simple enough. The issue I am running into is whenever my app opens up the page it states that the properties of my variables to hold the user input are undefined and I get this error even if I put a predetermined value in there such as “Test” for a string.

Here is my ts where I define the values.

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ViewController } from 'ionic-angular';
import { Alerts } from '../../models/alert';
import { Geolocation } from '@ionic-native/geolocation';
import { RestProvider } from '../../providers/rest/rest';

  selector: 'page-new-alert',
  templateUrl: 'new-alert.html',
export class NewAlertPage {

  public title: string = 'Testing if undefined';
  public severityLevel: string = '';
  public message: string = '';
  public description: string = '';
  public lat: number = 0;
  public long: number = 0;
  public scheduleAt: string = '';
  public updatedAt: string = '';
  public alert: Alerts;

    public navCtrl: NavController, 
    public navParams: NavParams, 
    public geolocation: Geolocation,
    public restProvider: RestProvider,
    private view: ViewController
  ) {


  ionViewDidLoad() {

  pushAlert() {

    this.alert.title = this.title;
    this.alert.severityLevel = this.severityLevel;
    this.alert.message = this.message;
    this.alert.description = this.description;

    this.alert.scheduleAt = new Date().toISOString();
    this.alert.updatedAt = "";
    this.geolocation.getCurrentPosition().then((resp) => {
      this.alert.latitude = resp.coords.latitude;
      this.alert.longitude = resp.coords.longitude;

     }).catch((error) => {
       console.log('Error getting location', error);

     //this.alert.latitude =;
     //this.alert.longitude = this.long;



  closeModal() {


And my HTML code.




<ion-content padding>
    <ion-label color="primary" stacked>Title</ion-label>
    <ion-input placeholder="Alert Title" [(ngModel)]="alert.title"></ion-input>

    <ion-label>Severity Level</ion-label>
    <ion-select [(ngModel)]="alert.severityLevel">
      <ion-option value="1">1</ion-option>
      <ion-option value="2">2</ion-option>
      <ion-option value="3">3</ion-option>
      <ion-option value="4">4</ion-option>
      <ion-option value="5">5</ion-option>

    <ion-label color="primary" stacked>Message</ion-label>
    <ion-input placeholder="Message" [(ngModel)]="alert.message"></ion-input>

    <ion-label color="primary" stacked>Description</ion-label>
    <ion-input placeholder="Description" [(ngModel)]="alert.description"></ion-input>

  <button ion-button color="primary" (click)="pushAlert()">
  <button ion-button color="primary" (click)="closeModal()">

Found the problem, forgot to switch my ngModel to the variables instead of my alert object.