Estoy haciendo una pagina web con un frontend en Angular y un backend con Symfony, de momento estoy utilizando como servidor xampp. Todo funcionaba de maravilla pero de repente, al iniciar el proyecto esta mañana me ha saltado un error por la consola del navegador
ERROR TypeError: "ctx.event.user is undefined" EventDetailComponent_Template event-detail.component.html:2 Angular 23 RxJS 5 Angular 8 core.js:6189:19 Angular 15 RxJS 5 Angular 8
En cuanto al compilador de ng serve de Angular tambien
ERROR in src/app/components/event-detail/event-detail.component.html:2:7 - error TS2339: Property 'user' does not exist on type 'Event'.>
2{{event.user.name}}
src/app/components/event-detail/event-detail.component.ts:13:16 13 templateUrl: './event-detail.component.html', Error occurs in the template of component EventDetailComponent.
El problema está en que el código funciona correctamente ya que uso exactamente lo mismo en otro componente y no tengo ningún fallo.
Como pone que no se encuentra la variable de event.user he decidido hacer una console.log(event)
para ver si realmente no están llegando bien los datos, pero al verificarlo, todos los datos llegan correctamente pero es como si no los detectase.
Hace relativamente poco que he empezado a utilizar Angular
y no se como seguir, estoy muy atascado ahora mismo.
Este es mi component.ts
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { UserService } from '../../services/user.service';
import { Event } from '../../models/event';
import { EventService } from '../../services/event.service';
import { ViewChild, ElementRef, NgZone } from '@angular/core';
import { MapsAPILoader } from '@agm/core';
@Component({
selector: 'app-event-detail',
templateUrl: './event-detail.component.html',
styleUrls: ['./event-detail.component.css'],
providers: [UserService, EventService]
})
export class EventDetailComponent implements OnInit {
public status;
public identity;
public token;
public event: Event;
constructor(
private _route: ActivatedRoute,
private _router: Router,
private _userService: UserService,
private _eventService: EventService,
) {
this.identity = this._userService.getIdentity();
this.token = this._userService.getToken();
}
ngOnInit(): void {
this.event = new Event(1, this.identity.sub, '', null, '', '', '','','', null, null);
this.getEvento();
}
getEvento(){
this._route.params.subscribe(params => {
var id = +params['id'];
this._eventService.getEvent(this.token, id).subscribe(
response => {
if(response.status == 'success') {
this.event = response.event;
}else{
this._router.navigate(['/mis-eventos']);
}
},
error => {
console.log(error);
this.status = error;
}
);
});
}
}
Y en el component.html lo llamo poniendo
<p>{{event.user.name}}<p>
edit: Aqui dejo el console.log(response) donde se ve claramente que la variable que pone que no esta definida existe y tiene los datos que necesito. Se me ha olvidado mencionar que los datos se ven por pantalla, pero el error sigue saliendo.
response
en el subscribe?Property 'user' does not exist on type 'Event'
es muy claro el mensaje, la propiedad user no existe en el tipoEvent
, verifica tu interfaz / modeloEvent
por favor. Por lo que veo está en'../../models/event'