sorry for this question but i’m in using ionic framework , and i want to know how to using an online database in my application
if This database exist on my server
Example what i want to Do
sorry for my Stupid , but how to make thing like this
thanks in advance
You’ll have to use web services for this
to send requests and receive data in the form that you like “json” will suit your needs
https://www.w3schools.com/js/js_json_intro.asp
…
for the web service you’ll need to write some server side code
like php
thank you for your reply
but can you give me an example to understand this process.
or a steps to do thing like this ? thank you.
Simple to understand: IonicApp -> PHP -> MySQL -> PHP -> Ionic2App
So with your Ionic2App you make a http POST/GET request to a php file.This PHP file connect to your MySQL Database and get the Data you want then print all the Data as Text or Json. And that output will be used in your Ionic2App.
Thats the simplest way to explain it but its also not hard to do it.
Search for:
How to do a http post request in ionic 2
How to do a http get request in ionic 2
How to get data of mysql through php
What is json output format
That should help you.
thank you very much this help me,
by using back& service
i understand the POST/GET http request and i make a provider that use Back& service and http
to work with database , but in my HomePage when i use this providers , say cannot find “provider name”
First try:
Change this:
import {Backend} from '../../providers/Backend/Backend';
to this
import {Backend} from '../providers/Backend';
If that doesnt work try this:
remove that line:
providers: [Backend]
then go to app.module.ts file in your project:
in this file add this on top:
import {Backend} from '../providers/Backend';
and at the bottom do this:
providers: [Backend];
Here is an Example of my app.module.ts:
.........
....................
bootstrap: [IonicApp],
entryComponents: [
MyApp,
MainActivity
],
providers: [Backend]
})
export class AppModule {}Is your Backend in src/providers/ folder or is it in src/providers/backend/ ?
Also show me your Backend file pls.
my backand provider is in src/providers
my backand provider
import { Injectable } from ‘@angular/core’;
import { Http,Headers } from ‘@angular/http’;
import ‘rxjs/add/operator/map’;
/*
Generated class for the Backand provider.
See https://angular.io/docs/ts/latest/guide/dependency-injection.html
for more info on providers and Angular 2 DI.
*/
@Injectable()
export class Backand {
auth_token: {header_name: string, header_value: string} = {header_name: 'AnonymousToken', header_value: 'de9e343d-f7ea-4ba6-9a18-7b5c21ecfc95'};
api_url: string = 'https://api.backand.com';
app_name: string = 'todoionic3';
constructor(public http: Http) {
console.log('Hello Backand Provider');
}
private authHeader() {
var authHeader = new Headers();
authHeader.append(this.auth_token.header_name, this.auth_token.header_value);
return authHeader;
}
public getTodos() {
return this.http.get(this.api_url + '/1/objects/todos?returnObject=true', {
headers: this.authHeader()
})
.map(res => res.json())
}
public addTodo(name: string) {
let data = JSON.stringify({name: name});
return this.http.post(this.api_url + '/1/objects/todos?returnObject=true', data,
{
headers: this.authHeader()
})
.map(res => {
return res.json();
});
}
public removeTodo(id: string) {
return this.http.delete(this.api_url + '/1/objects/todos/' + id,
{
headers: this.authHeader()
})
.map(res => {
return res.json();
});
}
}
my App.module.ts
import { NgModule, ErrorHandler } from ‘@angular/core’;
import { IonicApp, IonicModule, IonicErrorHandler } from ‘ionic-angular’;
import { MyApp } from ‘./app.component’;
import { HomePage } from ‘…/pages/home/home’;
import {Backand} from '../providers/Backand';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
@NgModule({
declarations: [
MyApp,
HomePage
],
imports: [
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage
],
providers: [
StatusBar,
SplashScreen,
Backand,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}Change this:
providers: [
StatusBar,
SplashScreen,
Backand,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
providers: [Backand]
and in your homepage.ts change this:
import {Backend} from '../providers/Backend';
to this:
import {Backand} from '../providers/Backand';
and this:
constructor(){public navCtrl: NavController, public backandService: Backend) { }
to this:
constructor(){public navCtrl: NavController, public backandService: Backand) { }
thank you ,but this dose not work for me
but this work
import { Backand } from "../../providers/backand";
but idont know why My visual studio code dose not give me error for this imprt
Ok perfect then 
Could it be that you have a subfolder like src/providers/backand/backand.ts ? Then it would make sense that this works for you:
import { Backand } from "../../providers/backand";
try this in your command promp
npm install npm@latest -g
npm install -g ionic cordova
Try this command line
npm install @ionic/app-scripts@1.1.4
nothing work for me
should i download anther project ?
The problem Solved correctly
the solution was
that i was using the same import in App,module.ts and home.ts but i figured that
in App.module.ts i must use : import { Backand } from '../providers/backand';
and in home.ts : import { Backand } from '../../providers/backand';
i have no sub-folders in providers folder;
thanks to all.
