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

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Diperbarui 8 tahun yang lalu

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

avatar hilmanski
@hilmanski

2692 Kontribusi 2139 Poin

Dipost 8 tahun yang lalu

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

avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

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?

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

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);
});
avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

<?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

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

coba tampilkan hasilnya, yang dilihat dengan console.log, bukan isi dari content.php nya

avatar hilmanski
@hilmanski

2692 Kontribusi 2139 Poin

Dipost 8 tahun yang lalu

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);
} );
}
avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

hasilnya sama bang ardy https://drive.google.com/file/d/0B1NEIEiKM7T5X2pxRktpNlhFbkk/view?usp=sharing

bang hilman : hasil yang gimana bang?

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

itu sebenernya ionic nya gak masalah, yang masalah di bagian server saran saya di bagian server output nya di bikin json, jangan array

avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

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;
 ?>
avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

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

avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

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

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

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

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

susah juga sih kalau cuman lihat error nya tanpa ngelihat koding nya tapi sepertinya itu ada tanda kurung "}" yang kurang atau berlebih

avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

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 ']}';

 ?>
avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

Jawaban Terpilih

echo ']}';

yang bikin salah, json itu harus nya

[{
title:'satu'
},
{
title:'dua'
}]

avatar ardyhim
@ardyhim

289 Kontribusi 175 Poin

Dipost 8 tahun yang lalu

astaga.. kurang ya bang.. ok" thanks bang

avatar rrhp
@rrhp

28 Kontribusi 2 Poin

Dipost 8 tahun yang lalu

Login untuk ikut Jawaban