2016-07-25 4 views
0

Сначала я инициализировал шаблон-приложение-приложение Polymer с использованием Polymer cli, а затем добавил хранилище Firebase в веб-приложение. Затем я добавил код загрузки файла на одну из страниц (код для этой страницы находится ниже). Однако я получаю следующие ошибки (Это предотвращает файлы, загруженные, а также не обновляет индикатор),Не удается загрузить изображения в хранилище Firebase

Uncaught TypeError: Cannot read property 'addEventListener' of null

а также

Uncaught TypeError: Cannot read property 'instanceCount' of undefined

Это мой код.

<link rel="import" href="../bower_components/polymer/polymer.html"> 

<dom-module id="my-market"> 

    <template> 

    <style> 
     :host { 
     display: block; 
     padding: 10px; 
     } 
     paper-card.top{ 
     margin-top: 8px; 
     width: 100%; 
     padding-bottom: 16px; 
     } 
    </style> 

    <paper-card heading="Welcome to the Market!"> 
     <div class="card-content"> 
     <h4>Upload a photo of your item</h4> 
     <!--uplod image--> 
     <input type="file" value="upload" id="fileUpload"/> 
     <progress value="0" max="100" id="uploader">0%</progress> 
     </div> 
    </paper-card> 

    </template> 

    <script> 

    //File upload script to Firebase storage 
    var uploader = document.getElementById('uploader'); 
    var fileButton = document.getElementById('fileUpload'); 

    //File selection listener 
    fileButton.addEventListener('change', function(a) { 

    //Get image 
    var file = a.target.files[0]; 

    //create a storage reference 
    var storageRef = firebase.storage().ref('images/' + file.name); 

    //store the image 
    var task = storageRef.put(file); 

    //notify the user of upload status 
    task.on('state_changed', 

     function progress(snapshot) { 
      var percentage = (snapshot.bytesTransferred/snapshot.totalBytes)*100; 
      uploader.value = percentage; 
     }, 

     function error(err) { 

     }, 

     function complete() { 

     } 

    ); 

    }); 

    </script> 


    <script> 

    Polymer({ 

     is: 'my-market' 

    }); 

    </script> 

</dom-module> 

Я также попытался поместить код для Firebase хранения в теге файла index.html, но он по-прежнему не работает. Какие-либо предложения?

ответ

2

Это исправление.

Просто поместите свой скрипт внутри Полимера ({}); функция.

Polymer({ 

    is: 'my-market', 

    upld: function(a) { 
     //Get image 
    var file = a.target.files[0]; 

    //create a storage reference 
    var storageRef = firebase.storage().ref('images/' + file.name); 

    //store the image 
    var task = storageRef.put(file); 

} 

}); 

И укажите атрибут on-change для «upld» для ввода файла.

+0

Все еще не работает ... Любые другие идеи? –

+0

Такое же сообщение об ошибке? – Carr

+0

Да ... Любые идеи почему? –

Смежные вопросы