电影数据库流行人物api与爱奥尼亚3

我正在尝试使用电影数据库api构建一个ionic 3应用程序

“我的应用”中的“热门人物”页面使用网站的api查看列表。我面临的问题是，当点击演员姓名时，人物详细信息页面应该可以查看网站上关于他们的所有信息。但是api在api中使用演员ID。我使用这个人的ID作为变量，并将其推送到“人员详细信息”页面（如下所示），然后使用navparams检索它，但似乎没有任何效果。浏览器的控制台显示json内容，但我无法在people-detail.html中检索它

我试图找到一个解决方案来检索json并在people-detail.html中查看它

我需要你的帮助，提前谢谢你

注意：我隐藏了apiKey，因为它是私钥

以下是我所做的澄清：-

people.html：-

<ion-content padding>
  <ion-list *ngFor="let people of peoples">
    <ion-item (click)="openPeopleDetailPage(people.id)">
      <ion-avatar item-start>
        <img src="{{'https://image.tmdb.org/t/p/w600_and_h900_bestv2'+people.profile_path}}">
      </ion-avatar>
      <h2>{{people.name}}</h2>
    </ion-item>
  </ion-list>
</ion-content>

peopleProvider.ts：-

@Injectable()
export class PeoplespProvider {

 people_url: string= "https://api.themoviedb.org/3/person/popular?<api_key>";

  constructor(public http: HttpClient) {
    console.log('Hello PeoplespProvider Provider');
  }

  getPeople(){
    return this.http.get(this.people_url)
  }

  getPeopleDetail(peopleId: number){
    return this.http.get('https://api.themoviedb.org/3/person/${peopleId}? 
    <api_key>')
  }

}

people-detail.html：-

<ion-content padding>
 <div>
 <div text-center>
  <img class="people-img" src=" 
 {{'https://image.tmdb.org/t/p/w600_and_h900_bestv2'+people?.profile_path}}">
</div>
<div>
  <h1 text-center>{{people?.name}}</h1>
</div>

<div>
  <ion-toolbar>
    <ion-segment [(ngModel)]="controls" color="secondary">
      <ion-segment-button value="info">Info</ion-segment-button>
      <ion-segment-button value="movies">Movies</ion-segment-button>
      <ion-segment-button value="tv-shows">TV Shows</ion-segment-button>
    </ion-segment>
  </ion-toolbar>
</div>

<div [ngSwitch]="controls">

  <div *ngSwitchCase="'info'">
    <ion-grid>
      <ion-row>
        <p>Born on <b>14/02/1986</b></p>
      </ion-row>
      <ion-row>
        <p text-wrap>From <b></b></p>
      </ion-row>
      <ion-row>
        <p>Also known as <b>Alex Daddario</b></p>
      </ion-row>
    </ion-grid>
    <p text-wrap>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
  </div>

  <div *ngSwitchCase="'movies'">
    <ion-list>
      <ion-item>
        <ion-thumbnail item-start>
          <img src="assets/imgs/1.jpg">
        </ion-thumbnail>
        <p class="movie-year">2018</p>
        <h2 text-wrap>The Big Bang Theory is here</h2>
        <p class="role-name">Constance Blackwood</p>
      </ion-item>
      <ion-item>
        <ion-thumbnail item-start>
          <img src="assets/imgs/1.jpg">
        </ion-thumbnail>
        <p class="movie-year">2018</p>
        <h2>Cher</h2>
        <p class="role-name">Constance Blackwood</p>
      </ion-item>
      <ion-item>
        <ion-thumbnail item-start>
          <img src="assets/imgs/1.jpg">
        </ion-thumbnail>
        <p class="movie-year">2018</p>
        <h2>Cher</h2>
        <p class="role-name">Constance Blackwood</p>
      </ion-item>
    </ion-list>
  </div>

  <div *ngSwitchCase="'tv-shows'">
    <ion-list>
      <ion-item>
        <ion-thumbnail item-start>
          <img src="assets/imgs/1.jpg">
        </ion-thumbnail>
        <p class="movie-year">2018</p>
        <h2 text-wrap>The Big Bang Theory is here</h2>
        <p class="role-name">Constance Blackwood</p>
      </ion-item>
      <ion-item>
        <ion-thumbnail item-start>
          <img src="assets/imgs/1.jpg">
        </ion-thumbnail>
        <p class="movie-year">2018</p>
        <h2>Cher</h2>
        <p class="role-name">Constance Blackwood</p>
      </ion-item>
      <ion-item>
        <ion-thumbnail item-start>
          <img src="assets/imgs/1.jpg">
        </ion-thumbnail>
        <p class="movie-year">2018</p>
        <h2>Cher</h2>
        <p class="role-name">Constance Blackwood</p>
      </ion-item>
    </ion-list>
  </div>

</div>

{{人？.name}
信息
影视
电视节目
1986年2月14日出生

来自

也被称为亚历克斯·达里奥

Sed ut perpiciatis unde omnis iste natus error site voluptate m accusantium doloremqu laudantium，totam rem aperiam，eaque ipsa quae a b illo inventor veritatiatis and quasi architect be vita dicta sunt explicabo。Nemo enim ipsam Voluptate是一个有着丰富经验的人，他是一个理性的人。最重要的一点是，在劳动和就业领域，所有人都有自己的权利、义务和义务
2018年
大爆炸理论就在这里
康斯坦斯·布莱克伍德

2018年
雪儿
康斯坦斯·布莱克伍德

2018年
雪儿
康斯坦斯·布莱克伍德

2018年
大爆炸理论就在这里
康斯坦斯·布莱克伍德

2018年
雪儿
康斯坦斯·布莱克伍德

2018年
雪儿
康斯坦斯·布莱克伍德

---

在您的people.html中，当您打开一个人的详细信息时，您似乎在推送该人的ID，但在您的people-detail.ts中，您将该ID分配给了一个people变量。当您稍后获取详细信息时，您正在使用 Const peopleid=this.people.id 事实不应如此。试用

---

Const peopleid=this.people。

在你的

people.html

中，你说的是people.id

<ion-item (click)="openPeopleDetailPage(people.id)">

。。。然后

const peopleId = this.people.id;

这段代码试图访问people.id.id，但这并不存在（我想是吧？）

解决方案

请尝试使用此选项：

const peopleId = this.people;

这应该给你正确的ID。顺便说一句，我看到你做了

This.people=data在代码的末尾。我建议您为这些数据创建一个不同的对象，而不是覆盖peopleId对象。例如，在文件顶部：

peopleData: any;

然后，你就说：

this.peopleData = data;

请记住替换所有
人员。
-people-detail.html

到

peopleData的插值。

people-detail.html代码在哪里？控制台中还有错误日志吗？但是我从people-detail.ts获取json请求的方式是我想要的。。问题出在people detail.html中。。我如何绑定它以查看它？？

const peopleId = this.people;

peopleData: any;

this.peopleData = data;