ngModel Post Data

Ionic Framework ionic-v3
1

Im getting this error from 9 a.m today. Anyone have any idea whats wrong with my code. In the .ts i include the function and my import.
Truly appreciate

Error: Uncaught (in promise): TypeError: Cannot read property ‘title’ of undefined

html

<ion-input maxlength="50" class=" border-white bg-light text-dark font-16 ptb1 plr20" formControlName="title" [(ngModel)]="meeting.title" type="text" placeholder="Tajuk Berita"></ion-input>

 <a class="up text-white block gradient-blue ptb15 mb10 round-small font-16 fw600" type="submit" (click)="show('Berita Sudah Di Simpan', 'top', 3000, false)">Simpan</a>

.ts

import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';



 onSubmit(){
   
    const headers = {  headers: new Headers({
      'Content-Type': 'application/json'
    })
    };

    let body = {
      title: this.title,
      date: this.date,
      time: this.time,
      detail: this.detail
    };

    console.log(this.body);

    this.http.post('http://xui.test/api/v1/meeting', body, headers )
    .map(res => res.json()).subscribe(resp => {
          this.meeting = resp;
          console.log(this.meeting);
    });
    
  }
2

@joenydepp You have this code:

this.http.post('http://xui.test/api/v1/meeting', body, headers).map(
    res => res.json()
).subscribe(resp => {
    this.meeting = resp;
    console.log(this.meeting);
});

Even if resp is a non-null object, you have to keep in mind that you’re receiving that only after the http call returns.

That is, the component property meeting is null/undefined until then.

So, you should not have that ion-input in your html while meeting doesn’t have a value.

You can make your ion-input like:

<ion-input *ngIf="meeting" maxlength="50" class=" border-white bg-light text-dark font-16 ptb1 plr20" formControlName="title" [(ngModel)]="meeting.title" type="text" placeholder="Tajuk Berita"></ion-input>

This way, it will only be rendered when meeting is defined.

You can also include a spinner or something like that for a better UX.

3

thank you for your reply and for the solution…i have fix the error n its working tq