I am working on the Backend with Symfony and the Frontend with Angular and I am being presented with the following. I have an affiliated class and another beneficiary, the beneficiary depends on an affiliate previously created, therefore, it has a foreign key to the affiliate. In the Frontend when I go to register a new beneficiary, I use a function of the affiliate service to search for that affiliate. When you do the search, bring that affiliate and fill in some fields of the form. Then I call the create function of the beneficiary service. When I believe the beneficiary is not collecting the parameter that I need from the affiliate service. Here is the affiliate service:
searchAfiliado(token, cedula){
let params = "authorization="+token;
let headers = new Headers({'Content-Type':'application/x-www-form-urlencoded'});
return this._http.post(this.url+'/afiliado/search/'+cedula, params, {headers: headers})
.pipe(
map(res => res.json())
);
}
And so is my beneficiary component:
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { UserService } from '../services/user.service';
import { AfiliadoService } from '../services/afiliado.service';
import { BeneficiarioService } from '../services/beneficiario.service';
import { Afiliado } from '../models/afiliado';
import { Beneficiario } from '../models/beneficiario';
@Component({
selector: 'beneficiario-new',
templateUrl: '../views/beneficiario.new.html',
providers: [UserService, AfiliadoService, BeneficiarioService]})
export class BeneficiarioNewComponent implements OnInit {
public title: string;
public n_bene;
public identida_usuario;
public token;
public afiliado: Afiliado;
public info_afiliado;
public searchA;
public beneficiario: Beneficiario;
public status;
constructor(
private _userService: UserService,
private _afiliadoService: AfiliadoService,
private _beneficiarioService: BeneficiarioService,
private _route: ActivatedRoute,
private _router: Router
) {
this.title = 'Registrar beneficiarios auxilio economico',
this.identida_usuario = this._userService.getIdentida_usuario();
this.token = this._userService.getToken();
this.n_bene = 1;
}
ngOnInit(){
console.log('componente de beneficiario cargado')
if (this.identida_usuario == null && !this.identida_usuario.sub) {
this._router.navigate(['/login']);
}else{
this.beneficiario = new Beneficiario(1, 1, '', 1, ''),
this.afiliado = new Afiliado(1, 1, "", "", "", "", "", "", 1, "", 1, "",
1, 1, 1, "", 1, "", 1, 1, 1, "", 1, "", "", 1,
"", "", 1, 1, 1)
}
}
search(){
console.log(this.searchA);
this._afiliadoService.searchAfiliado(this.token, this.searchA).subscribe(
response => {
//this.afiliado = response.data;
if (response.status != 'success') {
this.status = 'error';
}else{
this.afiliado = response.data;
console.log(this.afiliado)
//this._router.navigate(['/new-beneficiario'])
}
},
error => {
console.log(<any>error)
}
);
}
onSubmit(){
console.log(this.beneficiario);
this._beneficiarioService.create(this.token, this.beneficiario).subscribe(
response => {
if(response.status != 'success'){
this.status = 'error';
}else{
this.beneficiario = response.data;
// vaciar formulario
this.beneficiario = new Beneficiario(1, 1, '', 1, '');
console.log(this.beneficiario);
this.n_bene = this.n_bene + 1;
console.log(this.n_bene);
console.log(this.afiliado);
if(this.n_bene <= 3){
this._router.navigate(['/new-beneficiario']);
}else{
this._router.navigate(['/new-beneseguro']);
}
}
},
error => {
console.log(<any>error)
}
);
}
}
And finally, at the hearing, I try to capture the id of the member consulted, but I have not been able to capture that value.
<div class="row">
<h2 class="col-md-6 col-md-offset-4">{{title}}</h2>
<h3 class="col-md-6 col-md-offset-4">Beneficiario No. {{n_bene}}</h3>
</div>
<div class="col-md-6 col-md-offset-3">
<div class="form-group"></div>
<div class="card">
<div class="card-body card-block">
<div class="alert alert-success" *ngIf="status == 'success'">
Beneficiario creado correctamente!
</div>
<div class="alert alert-danger" *ngIf="status == 'error'">
¡Lo sentimos... Hubo algun error!
</div>
<hr>
<form class="form-horizontal" #beneficiarioNewForm="ngForm" (ngSubmit)="onSubmit()">
<div class="form-group">
</div>
<div class="form-group">
<form role="search">
<div class="form-group col-md-8 col-md-offset-2">
<input type="text" class="form-control" name="searchA" placeholder="Cedula o codigo militar..." [(ngModel)]="searchA" />
</div>
<div class="form-group col-md-2">
<input type="submit" class="form-control" value="Buscar" class="btn btn-success" (click)="search();">
</div>
<div class="col-md-12" *ngIf="afiliado">
<div class="panel panel-default afiliado-data">
<div class="panel-heading">
<h2>{{afiliado.ape1 + ' ' + afiliado.ape2 + ' ' + afiliado.nom1}}</h2>
<hr>
<h3 class="panel-cedula">
Cedula afiliado: <strong>{{afiliado.cedula}}</strong>
</h3>
<h3 class="panel-codmil">
Codigo militar: <strong>{{afiliado.codmil}}</strong>
</h3>
<h3 class="panel-codmil">
id afiliado: <strong>{{afiliado.id}}</strong>
</h3>
</div>
</div>
</div>
</form>
<div class="row form-group">
<div class="col-12 col-md-12">
<input type="text" class="form-control" name="id_afiliado" #id_afiliado="ngModel" [(ngModel)] = "beneficiario.id_afiliado" value="afiliado.id">
</div>
</div>
<div class="row form-group">
<div class="col-12 col-md-2">
<label for="text-input" class="form-control-label">Beneficiario</label>
</div>
<div class="col-12 col-md-10">
<input type="text" class="form-control" name="nombre_benef" #nombre_benef = "ngModel" [(ngModel)] = "beneficiario.nombre_benef" placeholder="Nombre del beneficiario" required>
<span *ngIf="!nombre_benef.valid && nombre_benef.touched">Nombre invalido!</span>
</div>
</div>
<div class="row form-group">
<div class="col-12 col-md-2">
<label for="select" class="form-control-label">Parentesco</label>
</div>
<div class="col-12 col-md-4">
<select name="parentesco" #id_parentesco = "ngModel" [(ngModel)] = "beneficiario.id_parentesco" class="form-control">
<option value="1">Hermano</option>
<option value="2">Hijo(a)</option>
</select>
</div>
<div class="col-12 col-md-1">
<label for="select" class="form-control-label">Edad</label>
</div>
<div class="col-12 col-md-5">
<input type="number" class="form-control" name="edad_bene" #edad = "ngModel" [(ngModel)] = "beneficiario.edad" placeholder="edad" required>
<span *ngIf="!edad.valid && edad.touched">Edad invalida!</span>
</div>
</div>
<div class="form-group">
</div>
<div class="row form-group">
<div class="col-12 col-md-9">
</div>
</div>
<div class="row form-group">
<div class="col-12 col-md-2">
</div>
<div class="col-12 col-md-4">
</div>
<div class="col-12 col-md-1">
</div>
<div class="col-12 col-md-5">
<input type="submit" value="Registrar beneficiario" class="btn btn-success btn-lg" [disabled]="!beneficiarioNewForm.form.valid">
</div>
</div>
</div>
</form>
</div>
<div class="row form-group">
</div>
</div>