Переменные машинописного текста с неопределенным значением пути к изображению

Question

Я хочу показать несколько изображений, которые я сохранил в вашем маршруте в PHPMyAdmin. У меня есть модель с переменными, которые должны сохранять каждый путь к изображению:

export class Selecciona {
  id: number;
  pc: string;
  pi: string;
  sc: string;
  si: string;
  tc: string;
  ti: string;
}

Кроме того, я создал службу, где я собираю данные, которые у меня есть в файле php:

import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Selecciona } from "../_model/selecciona.model";

@Injectable({
  providedIn: "root"
})
export class DatosPregunta {
  constructor(private http: HttpClient) {}

  getImagen() {
    let url = "http://localhost:8080/DatosChooseCode.php";
    let d = new Selecciona();
    return this.http.post<Selecciona[]>(url, d);
  }
}

Это мой php:

$cadena = file_get_contents('php://input');
$json = json_decode($cadena, true);

include 'index.php'; // Incluimos el archivo php el cual hace la conexion con la base datos

$consulta = "SELECT * FROM pildora2enric";
$resultado = mysqli_query($con, $consulta);
$datosUsuario = array();

if (mysqli_num_rows($resultado) > 0)
{
    $json = array();

    while($fila = mysqli_fetch_assoc($resultado))
    {
        array_push($json, $fila);
    }

    echo json_encode($json);
}

И, наконец, компонент, где изображения должны быть показаны, а затем увидеть их в html:

import { Component, OnInit } from "@angular/core";
import { DatosPregunta } from "../_service/datospregunta.service";
import { Selecciona } from "../_model/selecciona.model";

@Component({
  selector: "app-choosecode",
  templateUrl: "./choosecode.component.html",
  styleUrls: ["./choosecode.component.css"]
})
export class ChoosecodeComponent implements OnInit {
  SeleccionarImagenes: Selecciona[];


  constructor(private preguntas: DatosPregunta) {
    this.SeleccionarImagenes = new Array<Selecciona>();

    this.preguntas.getImagen().subscribe(
      ArrayImagenes => {
        ArrayImagenes.forEach(x => {
          let a: Selecciona;
          a = new Selecciona();
          a.id = Number.parseInt(x.id.toString());
          a.pc = x.pc;
          a.pi = x.pi;
          a.sc = x.sc;
          a.si = x.si;
          a.tc = x.tc;
          a.ti = x.ti;

          this.SeleccionarImagenes.push(a);
        });
        console.log(this.SeleccionarImagenes);
      },
      error => {
        console.log(error);
      }
    );
  }

  ngOnInit() {}
}