如何贴上多个图像 Symfony

how to affix multiple images Symfony

我有两个实体 Portfolio 和 images 关系 ManyToOne,照片在数据库中,我想检索它们,我得到这个结果。 Click Here

我想在投资组合列表中显示一张照片,并能够在项目详细信息页面上显示照片轮播。转到投资组合部分并单击 link(更多详细信息)。 https://bootstrapmade.com/demo/Arsha/ 但我有这个错误 Click Here

谢谢。

Images.Php

<?php

namespace App\Entity;

use App\Repository\ImagesRepository;
use Doctrine\ORM\Mapping as ORM;

/**
 * @ORM\Entity(repositoryClass=ImagesRepository::class)
 */
class Images
{
    /**
     * @ORM\Id
     * @ORM\GeneratedValue
     * @ORM\Column(type="integer")
     */
    private $id;

    /**
     * @ORM\ManyToOne(targetEntity=Portfolio::class, inversedBy="images")
     * @ORM\JoinColumn(nullable=false)
     */
    private $portfolios;

    /**
     * @ORM\Column(type="string", length=255)
     */
    private $nom;

    
    public function getId(): ?int
    {
        return $this->id;
    }

    public function getPortfolios(): ?Portfolio
    {
        return $this->portfolios;
    }

    public function setPortfolios(?Portfolio $portfolios): self
    {
        $this->portfolios = $portfolios;

        return $this;
    }

    public function getNom(): ?string
    {
        return $this->nom;
    }

    public function setNom(string $nom): self
    {
        $this->nom = $nom;

        return $this;
    }
}

Portfolio.php


   <?php

namespace App\Entity;

use App\Repository\PortfolioRepository;
use Doctrine\Common\Collections\ArrayCollection;
use Doctrine\Common\Collections\Collection;
use Doctrine\ORM\Mapping as ORM;
use Gedmo\Mapping\Annotation as Gedmo;


/**
 * @ORM\Entity(repositoryClass=PortfolioRepository::class) 
 */
class Portfolio
{
    /**
     * @ORM\Id
     * @ORM\GeneratedValue
     * @ORM\Column(type="integer")
     */
    private $id;

    /**
     * @ORM\Column(type="string", length=255)
     */
    private $titre;

    /**
     * @ORM\Column(type="string", length=255, nullable=true)
     */
    private $web;

    /**
     * @ORM\Column(type="string", length=255, nullable=true)
     */
    private $description;

    /**
     * @ORM\Column(type="text", nullable=true)
     */
    private $contenu;
    
    /**
     * @Gedmo\Slug(fields={"titre"})
     * @ORM\Column(type="string", length=255)
     */
    private $slug;

    /**
     * @ORM\ManyToOne(targetEntity=Client::class, inversedBy="portfolios")
     */
    private $clients;


    /**
     * @ORM\ManyToMany(targetEntity=Categorie::class, inversedBy="portfolios")
     */
    private $categories;

    /**
     * @var \DateTime $created_at
     * @Gedmo\Timestampable(on="create")
     * @ORM\Column(type="datetime")
     */
    private $created_at;

    /**
     * @var \DateTime $updated_at
     * @Gedmo\Timestampable(on="update")
     * @ORM\Column(type="datetime", nullable=true)
     */
    private $updated_at;

    /**
     * @ORM\OneToMany(targetEntity=Images::class, mappedBy="portfolios", orphanRemoval=true, cascade={"persist"})
     */
    private $images;

    public function __construct()
    {
        $this->categories = new ArrayCollection();
        $this->images = new ArrayCollection();
    }


    public function __toString()
    {
        return $this->titre;
    }

    public function getId(): ?int
    {
        return $this->id;
    }

    public function getTitre(): ?string
    {
        return $this->titre;
    }

    public function setTitre(string $titre): self
    {
        $this->titre = $titre;

        return $this;
    }

    public function getWeb(): ?string
    {
        return $this->web;
    }

    public function setWeb(?string $web): self
    {
        $this->web = $web;

        return $this;
    }

    public function getDescription(): ?string
    {
        return $this->description;
    }

    public function setDescription(?string $description): self
    {
        $this->description = $description;

        return $this;
    }

    public function getContenu(): ?string
    {
        return $this->contenu;
    }

    public function setContenu(?string $contenu): self
    {
        $this->contenu = $contenu;

        return $this;
    }

    
    public function getSlug(): ?string
    {
        return $this->slug;
    }


    /**
     * @return Collection|Categorie[]
     */
    public function getCategories(): Collection
    {
        return $this->categories;
    }

    public function addCategory(Categorie $category): self
    {
        if (!$this->categories->contains($category)) {
            $this->categories[] = $category;
        }

        return $this;
    }

    public function removeCategory(Categorie $category): self
    {
        $this->categories->removeElement($category);

        return $this;
    }

    public function getCreatedAt(): ?\DateTimeInterface
    {
        return $this->created_at;
    }   

    public function getUpdatedAt(): ?\DateTimeInterface
    {
        return $this->updated_at;
    }    

    public function getClients(): ?Client
    {
        return $this->clients;
    }

    public function setClients(?Client $clients): self
    {
        $this->clients = $clients;

        return $this;
    }

    /**
     * @return Collection|Images[]
     */
    public function getImages(): Collection
    {
        return $this->images;
    }

    public function addImage(Images $image): self
    {
        if (!$this->images->contains($image)) {
            $this->images[] = $image;
            $image->setPortfolios($this);
        }

        return $this;
    }

    public function removeImage(Images $image): self
    {
        if ($this->images->removeElement($image)) {
            // set the owning side to null (unless already changed)
            if ($image->getPortfolios() === $this) {
                $image->setPortfolios(null);
            }
        }

        return $this;
    }
}

Twig 投资组合列表 我找到了部分问题的解决方案,我可以检索项目列表的照片,但是在详细信息页面中我没有错误,但是图片未显示。

<div class="row portfolio-container">
            {% for portfolio in portfolios %}
            <div class="col-lg-4 col-md-6 portfolio-item filter-app">
                <div class="portfolio-wrap">
                    <img src="{{asset('assets/img/portfolio/' ~ portfolio.images[0].nom)}}" class="img-fluid" alt="">
                   
                    <div class="portfolio-info">
                        <h4>{{ portfolio.titre }}</h4>
                        {% for categorie in portfolio.categories %}
                        <p>{{ categorie.nom }}</p>
                        {% endfor %}
                        <div class="portfolio-links">
                            <a href="{{asset('assets/img/portfolio/portfolio-1.jpg')}}" data-gallery="portfolioGallery"
                                class="portfolio-lightbox" title="App 1"><i class="bx bx-plus"></i></a>
                                
                            <a href="{{ path('portfolio_detail', {'slug': portfolio.slug}) }}" title="Plus Details"><i class="bx bx-link"></i></a>
                        </div>
                    </div>
                </div>
            </div>
            {% endfor %}

Twig 投资组合详情

<div class="col-lg-8">
          <div class="portfolio-details-slider swiper-container">
           
            <div class="swiper-wrapper align-items-center">
              {% for images in portfolio.images  %}
              <div class="swiper-slide">
                <img src="{{asset('assets/img/portfolio/' ~ images.nom)}}" alt="">
              </div>
              
              {% endfor %}             
                     
            </div>
           
            <div class="swiper-pagination"></div>
          
          </div>
        </div>

控制器

 <?php

namespace App\Controller;

use App\Entity\Portfolio;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class AccueilController extends AbstractController
{
    /**
     * @Route("/", name="accueil")
     */
    public function index(): Response
    {
        //lister portfolio
        $portfolios = $this->getDoctrine()->getRepository(Portfolio::class)->findBy(
            [],
            ['created_at' => 'desc']
        );
        return $this->render('accueil/index.html.twig', [
            'portfolios' => $portfolios,
        ]);
    }

    
    /**
     * @Route("/portfolio/{slug}", name="portfolio_detail", methods={"GET"})     
     */
    public function detail($slug): Response
    {
          // On récupère l'article correspondant au slug
          $portfolio = $this->getDoctrine()->getRepository(Portfolio::class)->findOneBy(['slug' => $slug]);
        return $this->render('accueil/detail.html.twig', [
            'portfolio' => $portfolio,
        ]);
    }

}

   

我的代码有效,希望能帮到别人。

我留给你一个link虽然这是法语但是很棒。

https://nouvelle-techno.fr/actualites/live-coding-upload-dimages-multiples-avec-symfony-4-et-5