JSON с именем Зеро

Я делаю http-запрос на сервер JSON и помещаю значение в переменную, когда я делаю console.info(), он показывает мне всю информацию из json, но когда я пытаюсь использовать интерполяцию, чтобы передать информацию в шаблон , мне выдает эту ошибку

ERROR TypeError: Cannot read property 'numero' of undefined

A отметил, что json имеет ноль на своем имени, как я могу это решить?

Мой сервис:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

import { API } from '../../../app.api';


@Injectable({
  providedIn: 'root'
})
export class TarefadetalheService {

  constructor(private http: HttpClient) { }

  recuperaDetalhes(): any{
    return this.http.get("http://localhost:4000/tarefadetalhe")

 }
}

Вот моя страница, которая вызывает службу:

import { Component, OnInit } from '@angular/core';
import { NavParams } from '@ionic/angular';
import { TarefadetalheService } from './tarefadetalhe.service';
import { Tarefa } from '../../models/tarefa.model';

@Component({
  selector: 'app-tarefas-detalhe',
  templateUrl: './tarefas-detalhe.page.html',
  styleUrls: ['./tarefas-detalhe.page.scss'],
})
export class TarefasDetalhePage implements OnInit {
 idTarefa = null
 tarefa: any
  constructor(private navParams: NavParams, private getTarefaDetalhe: TarefadetalheService) { }

  ngOnInit() {
    this.idTarefa = this.navParams.get('id_tarefa');
    this.getTarefaDetalhe.recuperaDetalhes().subscribe((data)=>{
      this.tarefa = data[0] //now it works 
    })
  }
}

Вот мой шаблон:

<ion-header>
  <ion-toolbar>
    <ion-title>{{tarefa.numero}}</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
ID da tarefa é: {{idTarefa}}
</ion-content>

Как видите, теперь я могу отображать данные так, как хотел, но это постоянно выдает ошибку, я просто попытался запустить ionic serve еще раз, и никакого эффекта.

Я пытался сделать {{tarefa[0].numero}}, но таким образом он даже не показывает мне данные в шаблоне.