【问题标题】:Angular 4 - http.post doesn't receive list of objectsAngular 4 - http.post 没有收到对象列表
【发布时间】:2018-04-21 20:51:33
【问题描述】:

我想发出一个http.post 请求,用.subscribe 接收来自PHP 的对象列表。

当我这样做时,我会收到一个包含我的对象的字符串。 但是在*ngFor 循环中,控制台告诉我列表是undefined 变量。 这是我的代码:

list-master.ts

  /////
  objet01 = {ville: 'Bordeaux', prix: '69€'};
  objet02 = {ville: 'Lille', prix: '45€'};
  objs = [this.objet01, this.objet02];
  /////

  tempproj;


  constructor(public navCtrl: NavController, private navParams: NavParams, public http: Http) {

    this.http = http;

    this.getprojets();

  }

  getprojets() {
    var link = 'http://*****/getprojets.php';
    var myData = JSON.stringify({value: 'true'});

    this.http.post(link, myData)
    .subscribe(data => {
    this.tempproj = data["_body"]; 
    console.log('OKOK ' + this.tempproj + ' OKOK');
    }, error => {
    console.log("Oooops!");
    });

  }

这里是 getprojets.php

$postdata = file_get_contents("php://input");
    if (isset($postdata)) {
        $request = json_decode($postdata);
        $value = $request->value;

        if ($value === 'true' ) {
            $bdd = new PDO('***', '***', '***', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION));
            $bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING);

            $query = $bdd->prepare("SELECT * FROM projetsapparts") or die('Login invalide');
            $query->execute();
            $liste = array();
            class projet1 {};


 while ($projet = $query->fetch()) {
            $projet1 = new projet1;
            $projet1->ville = $projet['ville'];
            $projet1->photo = $projet['photo'];
            $liste[] = $projet1;
        }
        echo json_encode($liste);
    }
}
else {
    echo 'Erreur postdata';
}

然后,list-master.html

  <ion-slides class="marketslide" autoplay="3000" loop="true">
    <ion-slide *ngFor="let appart of tempproj">
      <ion-card (tap)="showplvdetails()">
        <img src="{{appart.photo}}">
        <div class="card-title">{{appart.ville}}</div>
      </ion-card>
    </ion-slide>
  </ion-slides> 

在控制台中,var tempproj 包含 3 个条目,它看起来像一个对象列表: [{"ville":"兰斯","照片":"http:******.jpg"},{"ville":"巴黎","照片":"http:****** .jpg"},{"ville":"阿姆斯特丹","照片":"http:******.jpg"}]

但是,我有这个错误:

Cannot read property 'hasAttribute' of undefined

在 .html 文件中,我将 var tempproj 替换为 *ngFor 中的 var objs(在 .ts 文件中设置,而不是来自 PHP),一切正常。

为什么 PHP 中的对象列表未定义? 在*ngFor="let appart of tempproj" 行上,'appart' 可以是一个对象吗? 请帮帮我,我只找到 JavaScript 和 Angular 2 的解决方案。我用了 5 天。

【问题讨论】:

  • 定义你的'temproj'。 as array const tempproj: Array = [];
  • 感谢您的回答。通过在构造函数之前写这个: tempproj: Array = [];我有一个新错误,这个: ListMasterPage.html:23 ERROR Error: Error trying to diff '[{"ville":"Reims","photo":"http:*****.jpg"},{ "ville":"巴黎","照片":"http:*****.jpg"},{"ville":"阿姆斯特丹","照片":"http:*****.jpg"} ]'。只允许使用数组和可迭代对象似乎更好,但总是不起作用。我不明白错误日志。

标签: json angular http ionic3


【解决方案1】:

这里的问题是您的 tempproj 对象在您的模板呈现时未定义。

也许你可以尝试将它初始化为一个空数组,

let tempproj: Array<any> = [];

constructor(public navCtrl: NavController, private navParams: NavParams, public http: Http) {

    ....

【讨论】:

  • 当我在变量名前写“let”时,它被突出显示。不是我在构造函数中写的时候,而是编译后效果不好。
  • 好的。你能创建一个 git 存储库并与我们分享吗?
  • 我不知道 git 是如何工作的,它是文件的云吗?与我电脑上的文件夹同步?我尝试注册,然后添加一个新的存储库等。当我在这里时 => hpics.li/72a52fd 我必须做什么?如何向其中添加文件? GitHub Desktop 说我不能发布未出生的分支... => hpics.li/194b44e 这是什么意思?感谢您的帮助;)
  • 经过一番搜索,我可以给你这个我在 git 上的存储库的 URL,我猜......github.com/Noxstyleprodz/ionicproject02是你问我的吗?
  • 在尝试编写类型之后,我想我发现了真正的问题:当我多次重新加载虚拟设备的页面时,我的代码得到了很好的工作,但只有几次(接近10 个中的 1 个或 2 个)。我想,HTML 代码和 TS 之间的加载时间似乎有问题.. :/ 你怎么看?如果我是对的,我该如何解决?
猜你喜欢
  • 2017-09-20
  • 1970-01-01
  • 1970-01-01
  • 2020-11-11
  • 1970-01-01
  • 2016-07-12
  • 1970-01-01
  • 1970-01-01
  • 2019-06-06
相关资源
最近更新 更多