es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Error TS2339: La propiedad ‘subscribe’ no existe en el tipo ‘{}’.

Error TS2339: La propiedad ‘subscribe’ no existe en el tipo ‘{}’.
Archivo de servicio:

import { HttpClient, HttpHeaders,HttpResponse  } from '@angular/common/http';
import { Person } from './person';
import { Injectable } from '@angular/core';
import { throwError } from 'rxjs';
import 'rxjs/add/operator/map'

import { map } from "rxjs/operators";

@Injectable({
  providedIn: 'root'
})
export class ApiService {
    baseURL: string = "http://localhost:3000/api/persons/";

constructor(private http: HttpClient) {
}

addPerson(id,name)
    {

  var obj={};
    var headers = new Headers();
    headers.append('Content-Type', 'application/json');
    let formData:FormData = new FormData();  
    formData.append('id',id);  
    formData.append('name',name);   

    this.http.post(this.baseURL + "addPerson?token",formData).pipe(map(data => {
      alert(data);
      return data;

    }));

    return obj;
  }
}

Archivo de componente:

import { Component, OnInit } from ‘@angular/core’;
import { ApiService } from ‘./api.service’;
import { Person } from ‘./person’;
import { Observable } from ‘rxjs’;

@Component({
selector: ‘app-root’,
templateUrl: ‘./app.component.html’,
styleUrls: [‘./app.component.css’]
})
export class AppComponent implements OnInit {
title = ‘httppost’;
people:Person[]=[];
person = new Person();

formData:any = {};

constructor(private apiService:ApiService) {
this.formData.ID =””; this.formData.Name= “”;
}

ngOnInit() {

}

addPerson() {
this.apiService.addPerson(this.formData.ID,this.formData.Name).subscribe(data => {
console.log(data)

})

}
}

Tags:  , , ,

Answer

  1. Avatar for davy.ai

    El error TS2339 indica que la propiedad ‘subscribe’ no existe en el tipo {}.

    En este escenario, parece que el método addPerson() del ApiService no está devolviendo un observable. Por lo tanto, al llamar a este método en el AppComponent e intentar suscribirse a él, TypeScript genera un error ya que no hay un método subscribe disponible en un objeto vacío.

    Para resolver este problema, el método addPerson() del ApiService debería devolver un Observable. Por lo tanto, puedes modificar el código en el ApiService de la siguiente manera:

    addPerson(id, name): Observable<person> {
      const formData: FormData = new FormData();
      formData.append('id', id);
      formData.append('name', name);
    
      return this.http.post<person>(`${this.baseURL}addPerson?token`, formData);
    }
    
    

    Con esta modificación, el método ahora devolverá un Observable de tipo Person. En el AppComponent, puedes suscribirte a este observable de la siguiente manera:

    this.apiService.addPerson(this.formData.ID, this.formData.Name)
      .subscribe((data: Person) => {
        console.log(data);
      });
    

    Esto debería resolver el error y permitirte suscribirte correctamente a la salida del método addPerson().

Comments are closed.