Angular insert data in mysql - mysql

Question

I am unable to insert de data into mysql using angular. If i want to fetch data in mysql it works ok, but this doesn't work.
I can't see the error. Can you help me?
this is my html form:
<form #suscribir="ngForm">
<div class="modal-body bodycolabora">
<label class="labelmodal">Recibe nuestros correos para estar al tanto de los últimos post y recursos subidos.</label>
<div class="md-form mb-2">
<label class="labelmodal">Tu nombre*</label>
<input class="form-control" type="text" name="nombre" class="input" placeholder="Tu nombre" [(ngModel)]="datos.nombre" required minlength="3" #nameInput="ngModel">
</div>
<div *ngIf="nameInput.invalid && (nameInput.dirty || nameInput.touched)"
class="alert alert-danger">
<div *ngIf="nameInput.errors.required">
Escribe tu nombre.
</div>
<div *ngIf="nameInput.errors.minlength">
Name must be at least 4 characters long.
</div>
</div>
<div class="md-form mb-2">
<label class="labelmodal">Email*</label>
<input class="form-control" type="email" name="email" class="input" placeholder="Tu email" [(ngModel)]="datos.email" required email #emailInput="ngModel">
</div>
<div *ngIf="emailInput.invalid && (emailInput.dirty || emailInput.touched)"
class="alert alert-danger">
<div *ngIf="emailInput.errors.required">
Escribe tu email.
</div>
</div>
<!--Privacidad-->
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="aceptopolitica" name="privacidad" value="acepto" ngModel required #privacidadInput="ngModel">
<label class="labelmodal" class="form-check-label" for="infantil" name="etapa" >Acepto la Política de privacidad</label>
</div>
<div *ngIf="privacidadInput.invalid && (privacidadInput.dirty || privacidadInput.touched)"
class="alert alert-danger">
<div *ngIf="privacidadInput.errors.required">
Acepta la política de privacidad
</div>
</div>
</div>
<div class="modal-footer footercolabora d-flex justify-content-center">
<button (click)="suscriptores()" value="Nuevo suscriptor" type="submit" name="submit" id="submit" class="btn btncolabora" [disabled]="suscribir.invalid">Enviar →</button>
</div>
</form>
In my component.ts i have:
datos={
nombre:null,
email:null
}
constructor(private articulosServicio: ServicioService) {
}
suscriptores() {
this.articulosServicio.suscriptores(this.datos).subscribe(datos => {
if (datos['resultado']=='OK') {
alert(datos['mensaje']);
}
});
In the service.ts:
url='http://xxxxxxxxxxx/'; //
constructor(private http: HttpClient) { }
suscriptores(datos) {
return this.http.post(`${this.url}suscriptores.php`, JSON.stringify(datos));
}
and finally the file.php,
<?php
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
header('Content-Type: application/json');
$json = file_get_contents('php://input');
$params = json_decode($json);
require("conexion.php");
$con=retornarConexion();
$email = mysqli_real_escape_string($con, $params->email);
$nombre = mysqli_real_escape_string($con, $params->nombre);
$query= 'INSERT INTO newsletter(email, nombre) VALUES ("' . $email . '","'. $nombre .'")';
if(mysqli_query($con, $query))
{
class Result {}
$response = new Result();
$response->resultado = 'OK';
$response->mensaje = 'datos grabados';
}
else
{
class Result {}
$response = new Result();
$response->resultado = 'OK';
$response->mensaje = 'datos grabados';
}
header('Content-Type: application/json');
echo json_encode($response);
?>
Sorry for all the code but i think you might need id to see the error