0

¿Como actualizo estos datos?:

Angular 5:

export class Cualquiera{
    constructor(
        private title: string,
        private datos: [{
            title: string,
            description: string
        }]
    ){}
}

Tengo el back-end hecho con nodejs. El caso es que al probar a actualizar desde un formulario de Angular el registro se crea, pero no los datos. Utilizo postman como aplicación REST, y ahí veo como genera un nuevo registro para datos, pero solo crea su id y no recibe los datos introducidos.

<form #pdForm="ngForm" (ngSubmit)="onSubmit()">
    <input type="text" name="title" #title="ngModel" [(ngModel)]="cualquiera.datos.title"><br />
    <input type="text" name="description" #description="ngModel" [(ngModel)]="cualquiera.datos.description">
    <button type="submit">Actualizar</button>
</form>

He dado mil vueltas, pero no he conseguido nada, de verdad pensé que esto iba a ser menos complicado, pero no se que es lo que se me escapa.

Cualquiera.findByIdAndUpdate(id,
        {$push: {datos: {title: update.title, description: update.description}}}, 
        (err, cualuqieraUpdated) => {
            if (err) { return res.send({message: err});}
            return res.send({message: 'Cualquiera actualizado.', cualquiera: cualquieraUpdated, update: update});
        }
    );

ese es el método del controlador en nodejs. La verdad, he hecho esto más veces, pero ahora después de haber probado varias formas no se que es lo que estoy haciendo mal. Un saludo.

EDITADO:

Aquí está el servicio que hace la petición al back-end:

const httpOptions = {
      headers: new HttpHeaders({'Content-type': 'application/json'})
};

.....

submitDatos(id: string, cualquiera : Cualquiera): Observable<Cualquiera>{
      return this._http.put<Cualquiera>(this.url + 'updateDatos/' + id, cualquiera, httpOptions).pipe(
        tap(tap(cv => this.log(`Datos actuaizados: id=${id}`)))
      );
    }

Ruta del back-end:

router.put('/updateDatos/:id', cualquieraController.updateDatos);

Y aquí está el submit desde el componente:

onSubmitDatos(){
   const id = this._route.snapshot.paramMap.get('id');
   this._cualquieraService.submitDatos(id, this.cualquiera).subscribe(
     response => {
      // console.log(response);
     },
     error => {
       console.log(error);
     }
   );
}
3
  • Añade porfa, el servicio que hace la petición al backend y como estas intentando recuperar el objeto desde el bakcend
    – Hictus
    el 8 feb. 2018 a las 12:22
  • 1
    Si desde Postman tampoco se guardan los datos, el problema no está en angular, sino en el backend el 8 feb. 2018 a las 12:36
  • Pero en postman si que lo recibe. Yo lo hago desde postman y funciona perfectamente. El caso es que yo creo que podría ser por el formulario desde el que lo envio. O no se, quizá no está usando bien los observables, con angular 5 HttpClient ha cambiado, y quizá se me escape algo, pero vamos, que en la documentación he estado mirando y se "supone" que tendría que funcionar correctamente.
    – H. Díaz
    el 8 feb. 2018 a las 12:39

1 respuesta 1

1

Asegurate de que antes de hacer la petición al servicio, el objeto que mandas esta bien formado, asegurando asi, que el problema no esta en el formulario de angular. Simplemente haz un console.log del objeto justo antes de la petición

return this._http.put<Cualquiera>(this.url + 'updateDatos/' + id, cualquiera, httpOptions).pipe(
        tap(tap(cv => this.log(`Datos actuaizados: id=${id}`)))
      );

Prueba a crear un objeto json embediendo el objeto cualquiera:

let cualquieraSend= {
   'cualquiera':cualquiera
};

const httpOptions = {
      headers: new HttpHeaders({'Content-type': 'application/json'})
};

return this._http.put<Cualquiera>(this.url + 'updateDatos/' + id, cualquieraSend, httpOptions).pipe(
        tap(tap(cv => this.log(`Datos actuaizados: id=${id}`)))
      );

Y desde el backend en el método que recibe la petición recupera el objeto del req.body y se lo pasas directamente al findByIdAndUpdate

let cualquieraObj=req.body.cualquiera;

Cualquiera.findByIdAndUpdate(id,establecimiento,(err, cualuqieraUpdated) => {
            if (err) { return res.send({message: err});}
            return res.send({message: 'Cualquiera actualizado.', cualquiera: cualquieraUpdated, update: cualquieraObj});
        }
    );

Así debería funcionarte, me comentas lo que sea.

4
  • Ha funcionado construyendo un objeto embebido. El caso es que el objeto parece no formarse bien con lo que tenía, puesto que cuando hago un console.log() del req.body en el back-end, no viene el objeto acompañado de los nuevos datos. La forma de acceder a los datos del objeto embebido en el back-end es esta, o al menos, la única forma en la que he accedido a ellos: var update = req.body; $push:{datos:{title:update[0].title,description:update[0].description} Seguiré investigando cual puede ser la razón por la no que recibo los datos. Muchas gracias por el aporte Hictus.
    – H. Díaz
    el 9 feb. 2018 a las 12:26
  • ¿Haciendo un console.log del req.body.cualquiera no te presenta el objeto completo con todos sus atributos?
    – Hictus
    el 9 feb. 2018 a las 12:27
  • Cuando lo hago con un objeto enbebido si, pero si lo hago como lo habia hecho hasta día de hoy no llega al back-end. Lo que realmente me deja intranquilo, es si lo estoy haciendo bien. Lo que pretendía está funcionando como tu me comentaste, y bastante bien, pero no sé si lo qu he hecho es un apaño, o va a funcionar bien siempre. De verdad que gracias, porque me estaba volviendo un poco tarumba con el caso este.
    – H. Díaz
    el 9 feb. 2018 a las 13:05
  • jajaja yo tengo todo mi bakcend montado de esa manera y me funciona estupendamente ;) Mencionarte que veo que estas haciendo$push:{datos:{title:update[0].title,description:update[0].description}, entiendo que para actualizar campos concretos, pero si le pasas el objeto completo, mongo es lo suficiente espabilado para detectar los campos. Si te sirvió la respuesta, no dudes en marcarla como aceptada ;)
    – Hictus
    el 9 feb. 2018 a las 13:10

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.