I want to send get request in ionic onClick but when i run app the screen is blank before onClick
Here is the code of ----------------------------------------------------------------------------------- app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { HTTP } from '@ionic-native/http';
@NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [
BrowserModule,
IonicModule.forRoot(),
AppRoutingModule
],
providers: [
HTTP,
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}
and here is the code of --------------------------------------------------------------------------- home.page.ts
import { Component } from '@angular/core';
import { HTTP } from '@ionic-native/http';
@Component({
selector: 'app-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss'],
})
export class HomePage
{
constructor(private http: HTTP) {}
showAlert()
{
this.http.get(SERVER_URL, {}, {})
.then(data => {
console.log(data.status);
console.log(data.data); // data received by server
console.log(data.headers);
})
.catch(error => {
console.log(error.status);
console.log(error.error); // error message as string
console.log(error.headers);
});
}
}
Here is the code of home.page.html where onClick triggered.
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
<ion-title>
Home
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-card class="welcome-card">
<ion-img src="/assets/shapes.svg"></ion-img>
<ion-card-header>
<div id="container">
<ion-list>
<br>
<ion-item >
<ion-label fixed>User Name</ion-label>
<ion-input type="text" value="" id="rounded" [(ngModel)]="username"></ion-input>
</ion-item>
</ion-list>
</div>
<ion-button (click) = "showAlert()">Submit</ion-button>
<br>
<ion-button color="primary">light</ion-button>
</ion-card-header>
</ion-card>
</ion-content>
