繁体   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