簡體   English   中英

以角度顯示數據時獲取[Object object]

[英]Getting [Object object] while displaying data in angular

我正在構建離子應用程序,但無法正確獲取數據。 嘗試使用HTTP服務訪問數據時,獲取此[Object object]並且未定義。 任何幫助將不勝感激。 謝謝。 PHP文件:

<?php
header('Access-Control-Allow-Origin: *');  
$dbhost = "127.0.0.1";
$dbuser = "root";
$dbpass = "******";
$db = "dbPlants"; 
$con = mysqli_connect($dbhost,$dbuser,$dbpass,$db);
class disease{
    var $id;
    var $name;
    var $sciname;
    var $cause;
}
$sqldata = mysqli_query($con,"SELECT * FROM tbldiseases");
$diseases=array();
while($row = mysqli_fetch_array($sqldata, MYSQLI_ASSOC))
{   
    $dis=new disease();
    $dis->id=$row["Diseasesid"];
    $dis->name=$row["name"];
    $dis->sciname=$row["ScientificName"];
    $dis->cause=$row["cause"];
    $diseases[]=$dis;
    /*$diseases[] = array($row["Diseasesid"],$row["name"],$row["ScientificName"],$row["cause"]);*/
}
echo json_encode($diseases);

mysqli_close($con);
?>

disease.service.ts文件:

import {Injectable} from "@angular/core"
import {Disease} from "./disease"
import {Http, Response} from "@angular/http"
import {Observable} from 'rxjs/Observable'
import 'rxjs/add/operator/map'
import 'rxjs/add/operator/catch'

@Injectable()
export class DiseaseService{
constructor(private http:Http){

}
getDiseases():Observable<Disease[]>
{
    return this.http.get('http://localhost/HowzMyPlant/hello.php').map(this.extractData)
    .catch((error:any)=>Observable.throw(error.json().error || 'Server error'));
}

private extractData(res:Response){
    let body=res.json();
    return body || [];
}
}

Disease.ts文件:

export class Disease{
constructor(public Id:number,
public Name:string,
public ScientificName:string,
public Cause:string){
}
}

libraryscreen.html文件:

<!DOCTYPE html>
<html>
<body>
<ion-content style="margin-top:70px;margin-bottom:90px">
    <div style="font-size:20px;font-weight:bold;margin-left:20px;color:darkgreen">
        All Diseases
    </div>
    <ion-list *ngFor="let dis of diseases">
        <ion-item (click)="getDiseaseInfo(dis.Name) ">
            <div style="display:inline-block ">
                <img src="no " ion-fab/>
            </div>
            <div style="display:inline-block ">
                <div>
                    {{dis.Name}}
                </div>
                <div>
                    {{dis.ScientificName}}
                </div>
                <div>
                    {{dis.Cause}}
                </div>
            </div>
        </ion-item>
    </ion-list>
</ion-content>

組件類:

@Component({
selector:'library-screen',
templateUrl:'libraryscreen.html',
providers:[DiseaseService]

})
export class LibraryScreenComponent implements OnInit{
public diseases : Disease[];
constructor(private diseaseService   : DiseaseService){
}


 ngOnInit(){
       this.diseaseService.getDiseases()
       .subscribe(dis=>{
           this.diseases=dis
          });
    }
    getDiseaseInfo(id:string){
       alert(id);
       }
    }

我正在調用PHP服務,並嘗試使用接收到的數據記錄創建離子項目。 請幫忙。

用戶對象不是存儲響應的數組

@Component({
    selector:'library-screen',
    templateUrl:'libraryscreen.html',
    providers:[DiseaseService]

    })
    export class LibraryScreenComponent implements OnInit{
    public diseases : Disease={};
    constructor(private diseaseService   : DiseaseService){
    }


     ngOnInit(){
           this.diseaseService.getDiseases()
           .subscribe(dis=>{
               this.diseases=dis
              });
        }
        getDiseaseInfo(id:string){
           alert(id);
           }
        }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM