Postingan lainnya
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
json ionic 2 error
Saya ingin bertanya teman-teman, saya baru belajar ionic 2. ini saya mencoba menyambungkan ionic dengan db yang saya buat. kode ini saya dapat di randomuser saya lupa linknya, saya coba tapi errornya seperti gambar dibawah kode ini. Mohon bantuannya teman -teman?
import { Component } from '@angular/core'; import { NavController } from 'ionic-angular';
import {Http} from '@angular/http'; import 'rxjs/add/operator/toPromise';
@Component({ selector: 'page-list2', templateUrl: 'list2.html' }) export class List2Page { public items:any;
constructor(public navCtrl: NavController, public http: Http) {
var baseUrl='192.168.1.1/mobile_apps/Dispendik_Surabaya/';
this.http = http; this.http.get(baseUrl+"content.php") .subscribe(data =>{ //console.log(data['_body']); this.items=JSON.parse(data['_body']); },error=>{ console.log(error); } ); }
buttonClick(event){ console.log("button clicked"); console.log(event); }
itemClicked(event,itemData){ console.log("item clicked"); console.log(event); console.log(itemData); }
}
https://drive.google.com/file/d/0B1NEIEiKM7T5d3R6cDdNek41bXM/view?usp=sharing
17 Jawaban:
di errornya ada pada JSON.parse, coba dilihat apa isi dari
console.log(data['_body']);
dan tambahkan informasinya, biar bisa lebih jelas kesalahannya dimana
di ionic biasa nya data nya terletak di data.json() jadi gak bisa langsung di ambil dengan dengan "data", harus ada ".json()"
subscribe(data =>{
//console.log(data['_body']);
this.items=data.json()
},error=>{
console.log(error);
} );
https://www.youtube.com/watch?v=uj0ZhNYNuq8 di video itu saya buat http.get di provider jadi agak lebih rapi
subscribe(data =>{
//console.log(data['_body']);
this.items=data.json()
},error=>{
console.log(error);
} );
yang ini harus dirubah seperti apa bang ardy? saya awam di programmer, cuma ingin belajar + ngembangin diri, istilahnya apa ya kalau searching digoogle?
coba kamu paste disini hasil dari output content.php kalau output dari content.php sudah jadi json, kamu ambil nya seperti ini
subscribe(data =>{
//console.log(data.json());
this.items=data.json()
},error=>{
console.log(error);
});
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Content-Type, x-xsrf-token");
include '../koneksi.php';
$conn=conn();
$sql = 'SELECT title from ulxae_content order by created desc ';
$stmt = $conn->prepare($sql);
$stmt->execute();
$data=array();
$i=0;
while ($r=$stmt->fetch()) {
print_r($r);
$data[$i]['title']=$r['title'];
}
$data=json_encode($data);
echo $data;
?>
ini bang isi dari content.phpnya
coba tampilkan hasilnya, yang dilihat dengan console.log, bukan isi dari content.php nya
berarti kamu ambil data nya dengan cara
this.http = http;
this.http.get(baseUrl+"content.php")
.subscribe(data =>{
console.log(data.json());
this.items=data.json();
},error=>{
console.log(error);
} );
}
hasilnya sama bang ardy https://drive.google.com/file/d/0B1NEIEiKM7T5X2pxRktpNlhFbkk/view?usp=sharing
bang hilman : hasil yang gimana bang?
itu sebenernya ionic nya gak masalah, yang masalah di bagian server saran saya di bagian server output nya di bikin json, jangan array
yang dibikin array itu yang ini ya bang? kalau ga array dibuat apa bang?
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Content-Type, x-xsrf-token");
include '../koneksi.php';
$conn=conn();
$sql = 'SELECT title from ulxae_content order by created desc ';
$stmt = $conn->prepare($sql);
$stmt->execute();
$data=array();
$i=0;
while ($r=$stmt->fetch()) {
print_r($r);
$data[$i]['title']=$r['title'];
}
$data=json_encode($data);
echo $data;
?>
coba kamu buka [link]http://192.168.1.1/mobile_apps/Dispendik_Surabaya/content.php[/link] di browser terus hasilnya posting disini, kalai hasil nya seperti di gambar ini https://drive.google.com/file/d/0B1NEIEiKM7T5X2pxRktpNlhFbkk/view?usp=sharing itu terlihat hasil console.log nya data nya berupa array jadi kamu ganti bagian php nya dengan output json untuk kodingan nya seperti apa, saya kurang paham php untuk refrensi php ke json coba lihat ini http://stackoverflow.com/questions/11722059/php-array-to-json-array-using-json-encode
Hasilnya seperti ini bang [link]https://drive.google.com/file/d/0B1NEIEiKM7T5TDBQbGE4QnNVS2c/view?usp=sharing[/link]
jsonnya harus kayak gini ya bang http://stackoverflow.com/questions/11195692/json-encode-sparse-php-array-as-json-array-not-json-object
ini sudah tak rubah seperti ini bang [link]https://drive.google.com/file/d/0B1NEIEiKM7T5UHFZc0xXT2pWUXM/view?usp=sharing[/link] tapi hasilnya sama gan errornya https://drive.google.com/file/d/0B1NEIEiKM7T5TVpDYm9wTGFjcjA/view?usp=sharing
susah juga sih kalau cuman lihat error nya tanpa ngelihat koding nya tapi sepertinya itu ada tanda kurung "}" yang kurang atau berlebih
ini koding .tsnya
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {Http} from '@angular/http';
import 'rxjs/add/operator/toPromise';
@Component({
selector: 'page-list2',
templateUrl: 'list2.html'
})
export class List2Page {
public items:any;
constructor(public navCtrl: NavController, public http: Http) {
var baseUrl='192.168.1.1/mobile_apps/Dispendik_Surabaya/';
this.http = http;
this.http.get(baseUrl+"content.php")
.subscribe(data =>{
console.log(data.json());
this.items=data.json();
},error=>{
console.log(error);
} );
}
buttonClick(event){
console.log("button clicked");
console.log(event);
}
itemClicked(event,itemData){
console.log("item clicked");
console.log(event);
console.log(itemData);
}
}
------ ini bagian htmlnya
<ion-header>
<ion-navbar color="primary">
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Berita</ion-title>
</ion-navbar>
</ion-header>
<ion-content >
<ion-list>
<ion-item *ngFor="let item of items" (click)="itemClicked($event,item)">
<h2>{{item.title}}</h2><br>
</ion-item>
</ion-list>
</ion-content>
--- ini bagian contentnya
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Content-Type, x-xsrf-token");
include '../koneksi.php';
$conn=conn();
$sql = 'SELECT * from ulxae_content order by created desc limit 10';
$stmt = $conn->prepare($sql);
$stmt->execute();
$i=0;
while ($r=$stmt->fetch()) {
$title=$r['title'];
echo '
{
"title":"'.$title.'",
},';
}
echo ']}';
?>
Jawaban Terpilih
echo ']}';
yang bikin salah, json itu harus nya
[{
title:'satu'
},
{
title:'dua'
}]