Проблемы с использованием определенных частей API

Привет, у меня есть код, который запускает информацию о звездных войнах из API. Это заняло некоторое время, но у меня все заработало, единственное, что одна кнопка выводит всю информацию. Мне интересно, как я могу прыгать взад и вперед по api, чтобы поставить разные вещи, если это возможно.

кнопка Люка Скайуокера выведет всю информацию для Люка, c-3P0 и r2-d2. Я знаю это, потому что это единственная кнопка, которая работает, но я не уверен, как это реализовать в противном случае.

// HTML

<button (click) = "onClick()">Luke Skywalker</button>
<button type = "button">C-3PO</button>
<button type = "button">R2-D2</button>


<ion-list>
<ion-item *ngFor = "let user of users">
    <h1>Name: {{ user.name }}</h1>
    <h1>Height: {{ user.height }}cm</h1>
    <h1>Mass: {{ user.mass }}kg</h1>
    <h1>Hair Color: {{ user.hair_color }}</h1>
    <h1>Skin Color: {{ user.skin_color }}</h1>
    <h1>Eye Coloe: {{ user.eye_color }}</h1>
    <h1>Birth Year: {{ user.birth_year }}</h1>
</ion-item>
</ion-list>

//по щелчку

  users = [];
  errorFromSubscribe;
  errorFromCatch;
  displayItems;

  constructor(private http: Http) { }

  onClick() {
     this.http.get('https://swapi.co/api/people')
     .subscribe((res: Response) => {
      this.users = res.json().results; 
      console.info(this.users)
      }, error => {
        console.info(error);
        this.errorFromSubscribe = error;
      });
  }

Api я использую: https://swapi.co/api/people

В api больше людей, но для решения вопроса я использую только первые 3.

Поэтому я действительно хотел бы знать, как я могу нажать кнопку C-3P0 и получить только информацию о c-3P0, а не информацию обо всех персонажах.

Вот экран вывода с консолью: https://imgur.com/M88Q1MP.