Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Erro no console src/app/extrato/extrato.component.ts:17:53 - error TS2304: Cannot find name 'Transferencia'.

o erro

 src/app/extrato/extrato.component.ts:17:53 - error TS2304: Cannot find name 'Transferencia'.

está aparecendo no console, mas aparentemente no navegador está tudo ok. Parece que o angular não está reconhecendo o Transferencia. Aqui estão meus códigos rodando no node 14.0.0

transferencia.model.ts

export interface Transferencia {
  id?: number | string;
  valor: number;
  destino: string;
  data?: string;
}

transferencia.service.ts

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

@Injectable({
  providedIn: 'root'//o root significa que esse serviço que está sendo feito em "tranferencia.service.ts poderá ser usado em toda a aplicação"
})
export class TransferenciasService {

  private listaTransferencia: any[];
  private url = 'http://localhost:3000/transferencias';

  constructor(private httpClient:HttpClient) {

    this.listaTransferencia = [];
  }

  get transferencias(){
    return this.listaTransferencia;
  }

  todas(): Observable<Transferencia[]>{
    return this.httpClient.get<Transferencia[]>(this.url);
  }

  adicionar(transferencia: any){
    this.hidratar(transferencia);

    this.listaTransferencia.push(transferencia);
  }

  private hidratar(transferencia: any){
    transferencia.data = new Date();
  }

}

extrato.componet.ts

import { TransferenciasService } from './../services/transferencia.service';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-extrato',
  templateUrl: './extrato.component.html',
  styleUrls: ['./extrato.component.scss']
})
export class ExtratoComponent implements OnInit {

  transferencias: any[];//Recebe o conteúdo do formulário

  constructor(private service: TransferenciasService) { }

  ngOnInit(): void {

    this.service.todas().subscribe((transferencias: Transferencia[]) => {
      console.table(transferencias);//irá imprimir o array no console em formato de tabela, por ser uma tabela mesmo
      this.transferencias = transferencias;
    });

  }

}
3 respostas
solução!

Olá, Jorge! Tudo bem?

No seu arquivo extrato.component.ts você está definindo o tipo de transferencias como uma array de Transferencia:

this.service.todas().subscribe((transferencias: Transferencia[]) => {

Porém, não parece ter importado o modelo Transferencia (transferencia.model.ts) nesse arquivo. Poderia confirmar?

Se o seu projeto está como o do curso, a importação deve ser feita da seguinte forma:

import { Transferencia } from '../models/transferencia.model';

Aguardo o retorno!

Olá

Obrigado pela ajuda. Vc tinha razão o transferencia não estava importado, mas estou em dúvida em qual arquivo devo importar o transferencia da maneira que vc informou? Devo importar o transferencia em ambos os arquivos: extrato.component.ts e transferencia.service.ts? Ou em apenas em um deles. Tentei as seguintes maneiras:

  • Importei no transferencia.service.ts e o erro aparecia no arquivo extrato.component.ts e vice-versa

Jorge, em ambos. O arquivo precisa da importação se de alguma forma utiliza o código do outro arquivo.

Tanto no caso do extrato.component.ts quanto no caso do transferencia.service.ts, é utilizada a Transferencia para definir tipos. Assim, é necessário que esses arquivos importem de transferencia.model.ts.

Bons estudos!