Come caricare un'immagine usando angular + symfony + vichuploaderBundle

Question

Sto provando a caricare un'immagine usando angular e vichUploaderBundle per symfony.

L'idea è la seguente,

ho alcune schede, se si fa clic su di loro faranno mostrano forme diverse, uno di loro è per il caricamento di file. La mia domanda è, come posso caricare l'immagine? Intendo il modo corretto. Ho un file html.twig, con un modulo all'interno (sto usando include il motore di ramoscello). Supponiamo che io sono questo form.html.twig

<form onsubmit="{{ path('upload-new-file') }}"> 
    <input type="file" id="someFile"/> 
     <button> Upload Image </button> 
</form> 

Una volta selezionata l'immagine, cliccare su Carica, questo determinerà quale URL corrisponde con upload-nuovo file (routing.yml) (per esempio, Effettuerà qualche query per caricare il file)

Il mio problema principale è che mi confondo perché ho programmato i miei moduli in php (usando createForm, form-> isvalid, ecc.) E quindi li ho resi con il ramoscello , Sto anche usando vichUploaderBundle. Nella situazione che ho descritto non sono in grado di farlo, perché non ho il "modulo" per renderlo. ({{Modulo (form)}}). Non sto passando il modulo come parametro nel solito modo (come nei documenti symfony; $ this-> render ('someTemplate.html.twig', array ('form' => $ form)))

Immagina di avere una pagina web, con schede, e se fai clic in una delle schede, verrà visualizzato un modulo, uno dei moduli contiene un input di caricamento, si seleziona un'immagine e si fa clic sul caricamento, e allora? Ricordiamo che sto usando angularjs, vichuploaderbundle, symfony e Doctrine come ORM.

Grazie in anticipo!

Answer 1

file di ramoscello

{{ form_start(form, {'attr': {'novalidate': 'novalidate'} }) }} 
      <div class="form-group"> 
       <label>{{"news.lbl.file"|trans}}</label> 
       {{form_widget(form.file)}} 
       <lable>{{form_errors(form.file)}}</lable> 
      </div> 
    <div class="form-group"> 
       {{form_widget(form.submit)}} 
      </div> 
      {{ form_end(form)}} 

classe uploder

<?php 

namespace BaseBundle\Entity; 

use Doctrine\ORM\Mapping as ORM; 
use Symfony\Component\Validator\Constraints as Assert; 
use Symfony\Component\HttpFoundation\File\UploadedFile; 

abstract class Uploader 
{ 

    /** 
    * @var integer 
    * 
    * @ORM\Column(name="id", type="integer") 
    * @ORM\Id 
    * @ORM\GeneratedValue(strategy="AUTO") 
    */ 
    private $id; 

    /** 
    * @var string 
    * 
    * @ORM\Column(name="path", type="string", length=500,nullable=true) 
    */ 
    protected $path; 

    /** 
    * Set imageUrl 
    * 
    * @param string $path 
    * @return Category1 
    */ 
    public function setPath($path) 
    { 
     $this->path = $path; 

     return $this; 
    } 

    /** 
    * Get path 
    * 
    * @return string 
    */ 
    public function getPath() 
    { 
     return $this->path; 
    } 

    /** 
    * Get id 
    * 
    * @return integer 
    */ 
    public function getId() 
    { 
     return $this->id; 
    } 

    public function getAbsolutePath() 
    { 
     return null === $this->path ? null : $this->getUploadRootDir() . '/' . $this->path; 
    } 

    public function getWebPath() 
    { 
     return null === $this->path ? null : $this->getUploadDir() . '/' . $this->path; 
    } 

    protected function getUploadRootDir($docroot="web") 
    { 
// the absolute directory path where uploaded 
// documents should be saved 
     return __DIR__ . "/../../../../$docroot/" . $this->getUploadDir(); 
    } 

    protected abstract function getUploadDir(); 

    /** 
    * @Assert\File(maxSize="6000000") 
    */ 
    protected $file; 

    /** 
    * Sets file. 
    * 
    * @param UploadedFile $file 
    */ 
    public function setFile(UploadedFile $file = null) 
    { 
     $this->file = $file; 
    } 

    /** 
    * Get file. 
    * 
    * @return UploadedFile 
    */ 
    public function getFile() 
    { 
     return $this->file; 
    } 

    public function upload() 
    { 
     // the file property can be empty if the field is not required 
     if (null === $this->getFile()) 
     { 
      return; 
     } 
// use the original file name here but you should 
// sanitize it at least to avoid any security issues 
// move takes the target directory and then the 
// target filename to move to 
     $name = $this->getUploadDir() . "/" . time() . "-" . $this->getFile()->getClientOriginalName(); 
     $this->getFile()->move(
       $this->getUploadRootDir(), $name 
     ); 
// set the path property to the filename where you've saved the file 
     $this->path = $name; 
// clean up the file property as you won't need it anymore 
     $this->file = null; 
    } 

} 

classe di entità

class entity extends Uploder 
{ 

protected function getUploadDir() 
    { 
     return 'dirctory name'; 
    } 
} 

e aggiungere il percorso presentato poi REMOV percorso