Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Angular Discussion :

Pourquoi mon objet file est-il vide ?


Sujet :

Angular

  1. #1
    Membre confirmé

    Profil pro
    Inscrit en
    août 2008
    Messages
    1 087
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : août 2008
    Messages : 1 087
    Points : 516
    Points
    516
    Par défaut Pourquoi mon objet file est-il vide ?
    Bonjour,

    j'ai un formulaire d'upload de fichier, et je souhaite enregistrer l'objet file dans un attribut, le problème c'est que cette attribut est vide ?
    voici mon code:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <input type="file" (change)="onFileSelected($event)">
    <button type="button" (click)="onUpload()">envoyé</button>


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    export class ConnexionComponent implements OnInit {
      loginFail = null;
      selectedFile= null;
     
      constructor(private authService:AuthenticationService,private router:Router,private http:HttpClient) {
      }
     
     
      onFileSelected(event){
        console.log("111 event ");
        console.log(event.target.files[0]);
        console.log("222 target 0  ");
        this.selectedFile = event.target.files[0];
        console.log(this.selectedFile); 
      }
     
      onUpload(){
        console.log("==>"+this.selectedFile); 
        console.log("==>"+JSON.stringify(this.selectedFile));
    voici le résultat:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    111 event 
    connexion.component.ts:23 File*{name: "bombonne.jpg", lastModified: 1564679643000, lastModifiedDate: Thu Aug 01 2019 19:14:03 GMT+0200 (heure d’été d’Europe centrale), webkitRelativePath: "", size: 4154484,*}
    connexion.component.ts:24 222 target 0  
    connexion.component.ts:26 File*{name: "bombonne.jpg", lastModified: 1564679643000, lastModifiedDate: Thu Aug 01 2019 19:14:03 GMT+0200 (heure d’été d’Europe centrale), webkitRelativePath: "", size: 4154484,*}
    connexion.component.ts:30 ==>[object File]
    connexion.component.ts:31 ==>{}
    à la ligne 31 mon objet est vide:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    connexion.component.ts:31 ==>{}
    je ne comprend pas pourquoi il n'y a rien dedans ?
    merci d'avance pour la réponse

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    13 821
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 13 821
    Points : 33 562
    Points
    33 562
    Par défaut
    Bonjour,
    on ne peut pas « stringifier » un objet File, certaines autres méthodes ne fonctionnent d'ailleurs pas mieux
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    const o = event.target.files[0];
    console.log("JSON.stringify(o) :", JSON.stringify(o));      // >> {}
    console.log("Object.assign({}, o)", Object.assign({}, o));  // >> {}
    console.log("{ ...o } :", { ...o});                         // >> {}
    console.log("Object.keys(o) :", Object.keys(o));            // >> []
    console.log("Object.entries(o) :", Object.entries(o));      // >> []
    Un façon de lire reste la bonne vielle boucle for(..in..) :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    for (let key in o) {
      console.log(`${key} : ${o[key]}`);
    }
    La question qui demeure est pourquoi veux tu « stringifier » l'objet File ?

  3. #3
    Membre confirmé

    Profil pro
    Inscrit en
    août 2008
    Messages
    1 087
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : août 2008
    Messages : 1 087
    Points : 516
    Points
    516
    Par défaut
    merci de ta réponse ,
    je pense que je me trompe, je condidère JSON.stringify comme une sérialialization, mais ce n'est pas la même chose .
    et puis j'ai fait une autre erreur, pour simplifier mon test je met l'attribut et je met une concatenation "+", du coup tout les console log son fausse puisque quand je regarde dans l'objet il est vide.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
      onFileSelected(event){
     
        console.log(event.target.files[0]);   
        this.selectedFile = event.target.files[0];
        console.log("onFileSelected(event) ==>"); 
        console.log(this.selectedFile); 
        console.log("onFileSelected(event) ==>"+this.selectedFile); 
      }
     
      onUpload(){
        console.log("onUpload()"); 
        console.log(this.selectedFile); 
        console.log(this.selectedFile.name);
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
     
    File*{name: "bombonne.jpg", lastModified: 1564679643000, lastModifiedDate: Thu Aug 01 2019 19:14:03 GMT+0200 (heure d’été d’Europe centrale), webkitRelativePath: "", size: 4154484,*}
    connexion.component.ts:25 onFileSelected(event) ==>
    connexion.component.ts:26 File*{name: "bombonne.jpg", lastModified: 1564679643000, lastModifiedDate: Thu Aug 01 2019 19:14:03 GMT+0200 (heure d’été d’Europe centrale), webkitRelativePath: "", size: 4154484,*}
    connexion.component.ts:27 onFileSelected(event) ==>[object File]
    connexion.component.ts:31 onUpload()
    connexion.component.ts:32 File*{name: "bombonne.jpg", lastModified: 1564679643000, lastModifiedDate: Thu Aug 01 2019 19:14:03 GMT+0200 (heure d’été d’Europe centrale), webkitRelativePath: "", size: 4154484,*}
    connexion.component.ts:33 bombonne.jpg
    this.selectedFile sera toujours vide dès que j'utilise

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
        console.log("onFileSelected(event) ==>"+this.selectedFile);
    j'utilise mal la console.log, je peux maintenant récupérer mon objet.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 6
    Dernier message: 12/02/2007, 19h24
  2. Réponses: 4
    Dernier message: 28/09/2006, 14h50
  3. [C# 2.0] Pourquoi mon DataAdapter n'est pas instancié ?
    Par FraktaL dans le forum Services Web
    Réponses: 2
    Dernier message: 04/07/2006, 00h04
  4. [C#]Quand mon objet axWebBrowser est-il supprimé ?
    Par Kcirtap dans le forum Windows Forms
    Réponses: 5
    Dernier message: 18/10/2005, 10h16

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo