如何使用php在ionic3中显示YouTube json数据

时间:2018-06-25 11:25:41

标签: ionic-framework ionic3

我获取了youtube json数据并将其保存在http://localhost/jsonyoutube.php中。

现在我想在离子视图页面(即home.html)中显示json数据

尝试时出现错误:ERROR Error: Error trying to diff '[object Object]'. Only arrays and iterables are allowed

但是当我尝试在控制台中运行时效果很好。我无法在视图页面中显示它

我在这里分享我的密码

home.ts

     load() : void
    {
  this.http
  .get('http://localhost/jsonyoutube.php')
  .subscribe((data : any) =>
   {
     //console.dir(data.items["0"].snippet.thumbnails.default.url);
     console.dir(data);
     this.items = data;
     //console.dir(this.items);
   },
  (error : any) =>
  {
     console.dir(error);
  });
  }

home.html

  <ion-content padding style="background-color: #251D32 !important;">
  <ion-grid >
  <ion-row>
   <ion-col col-6 col-md-4 col-xl-3 *ngFor="let item of items">
    <ion-card class="video-container">
     <iframe src="https://www.youtube.com/embed/{{item.id.videoId}}" 
    frameborder="0" width="100%" height="315" allowfullscreen></iframe>
        </ion-card>
  </ion-col>  
  </ion-row>
  </ion-grid>  
  </ion-content>

0 个答案:

没有答案