how to pass the paramenter to url - ionic-framework

i have some screen, where i will call some url. But i know how to call the function using get and show the data.But now i want to send the parameter with url.
here my url.i need to send the parameter :
this.passingdata = { CatID: "2" };
This above parameter i need to send to below get url function
constructor(public viewCtrl: ViewController, public modalCtrl: ModalController, private http: Http, public loadingCtrl: LoadingController) {
let that = this
let loader = this.loadingCtrl.create({
content: "Please wait..."
});
loader.present();
that.http.get('http://www.example.com/api/tackj.php').map((res) => res.json()).subscribe((data: any) =>{
that.questions = data.QuestionsList;
loader.dismiss();
})
}
ionViewDidLoad() {
let that = this;
that.slides.lockSwipes(true);
that.slides.enableKeyboardControl(false);
}
Thank in advance !!

If you want to pass some parameters most probably it would be a post method then you can pass data as second parameter to the http.post method. So you need to find out whether the API is post method or get method.
Refer this link
AngularJS passing data to $http.get request

Related

Http get request URL shows [object promise]

I am trying to use web api call get method to access data and display in my page. My url would be something like: https://localhost:44399/api/APIOrder/GetUserOrder?email=xxx#gmail.com to be able to display the data.
However, when I combine my url with a variable,it doesn't display anything and console log shows the url in https://localhost:44399/api/APIOrder/GetUserOrder?email=[object Promise]. Is there any way to let the url read my this.User variable?
please review my getUserOrder()
User = this.storage.get('currentUser');
constructor(private http:Http,public storage: Storage){
}
public getUserOrder()
{
var url="https://localhost:44399/api/APIOrder/GetUserOrder?email=";
console.log(url+this.User);
return this.http.get(url+this.User).map(res=>res.json());
}
I am really new to this. Pls tell me if i am unclear. Any help would be much appreciated..
UPDATE
It shows undefined because it accessed the variable value on top but not from ionViewWillEnter
User:string;
constructor(private http:Http,public storage: Storage){
}
async ionViewWillEnter()
{
this.User = await this.storage.get('currentUser');
}
public getUserOrder()
{
var url="https://localhost:44399/api/APIOrder/GetUserOrder?email=";
console.log(url+ this.User);
return this.http.get(url+this.User).map(res=>res.json());
}
You should await the return of the Promise. You can do this inside the constructor or inside a lifecyle like ionViewWillEnter()
User: string;
async ionViewWillEnter() {
this.User = await this.storage.get('currentUser');
}
Answer here: "This is the expected result."
UPDATE
This is a different approach: if your function is directly called somehow, you can create a function which returns the variable from storage. If the data is found, proceed with the http request.
async getUserOrder() {
const user = await this.getUserFromStorage();
if (user) {
var url="https://localhost:44399/api/APIOrder/GetUserOrder?email=";
return this.http.get(url + user).map(res=>res.json());
}
}
async getUserFromStorage(): Promise<string> {
return await this.storage.get('currentUser');
}

Can we use queryParams in ionic4?

We have used queryParams for angular projects. can we use queryParams in ionic project?
is there any side effect or security issues?
this.router.navigate(['your-page-name-here'], params);
You can use queryParams but it is not a recommended way because you are sending values as a part of router link. This also means that you are limited to strings only and objects need to be stringified (JSON.stringify()) and parsed each time you send data.
Better option is to use Extras State:
let navigationExtras: NavigationExtras = {
state: {
userData: this.user
}
};
this.router.navigate(['my-page'], navigationExtras);
In MyPage, get data from the State by injecting Router in constructor:
this.data = this.router.getCurrentNavigation().extras.state.userData;
Using Service: Also, you can create a service that has a getter and setter that you can use to save data in it before navigating and retrieve it after completing the navigation:
import { Injectable } from '#angular/core';
#Injectable({
providedIn: 'root'
})
export class DataService {
private data = [];
constructor() { }
setData(id, data) {
this.data[id] = data;
}
getData(id) {
return this.data[id];
}
}

Ionic Redirect with Value

I have two pages: tab2 and request. When I click the button on tab2 I want to send id data to the request page. I don't want to use local storage, i tried:
tab2.page.ts
clickFunc(){
this.router.navigate(['/request', id]);
}
request.page.ts
this.router.params.subscribe(params => {
console.log(params['id']); //it gives undefined.
});
When i receive the id values, request pg gives error.
Change the code in the request.page.ts file as mentioned below:
import { ActivatedRoute, Router } from '#angular/router';
constructor(private route: ActivatedRoute, private router: Router)
{
this.route.queryParams.subscribe(params => {
console.log(params['id']); // This will give you the id param's value
});
}
I hope it helps!

Passing parameters from api in ionic 3

I am new to Ionic and trying to pass api from providers to application's ts page but I am getting an error, maybe I am passing the wrong id.
TS part:
export class CardsPage {
currentItems: Item[];
id: any;
getData: Object;
categories;
constructor(public navCtrl: NavController, public api:Api, navParams:
NavParams, items: Items, public http: HttpClient) {
this.id = navParams.get('idName') ||'';
console.log(this.id);
this.api.getCategoryPosts(this.id).subscribe(data=>{
console.log(data)
this.getData = data
},err=>{
console.log(err)
})
}
openItem(item){
this.navCtrl.push('ItemDetailPage', {
itemName: item
});
}
}
Api:
getCategoryPosts(category: any) {
return this.http.get(`${this.api_url}/posts?categories=${category.id}`);
}
I have posted the code part about my API and ts file now I want to pass data to next page using parameters. I wanted to know what should I pass in parameter to get data displayed in next page
According to your code, You are passing id directly to the Service's getCategoryPosts method. Therefore use category instead of category.id as below.
getCategoryPosts(category: any) {
return this.http.get(`${this.api_url}/posts?categories=${category}`);
}

Jquery UI Autocomplete - How to pass the variable from Jquery to ashx handler

I am using Jquery UI Multiple Values Autocomplete and I'm making the request to Server:
.autocomplete({
source: function(request, response) {
$.getJSON("handlers/autocomplete.ashx", {
term: extractLast(request.term)
}, response);
},
How to I get back the value of term in my .ashx handler?
I have tried Request.Form["TextBox1"] but I'm getting object reference not set to an intance of an object error. Is there any way I can get it directly?
Thanks
pass TextBox1 value with the url
.autocomplete({
source: function(request, response) {
$.getJSON("handlers/autocomplete.ashx?TextBox1=curtxt", {
term: extractLast(request.term)
}, response);
},
Read TextBox1 from Handlers
public void ProcessRequest(HttpContext context)
{
HttpRequest request = context.Request;
HttpResponse response = context.Response;
string txtval = request["TextBox1"];
}