title: Type 'FileUpload[][]' is not assignable to type 'AngularFireList<FileUpload[]>'
body: <p>I am building an Angular app with Firebase to upload an image to the database and retrieve it from there as well. </p>
  
  <h2>upload-file.service.ts</h2>
  
  <pre><code>import {Injectable} from '@angular/core';
  import {AngularFireDatabase, AngularFireList} from 'angularfire2/database';
  import * as firebase from 'firebase';
  
  import {FileUpload} from '../uploadingpage/fileupload';
  
  @Injectable()
  export class UploadFileService {
  
    constructor(private db: AngularFireDatabase) {}
    getFileUploads (): AngularFireList&lt;FileUpload[]&gt;{
          return this.db.list('/uploads');
      }
  
    private basePath = '/uploads';
    fileUploads: AngularFireList&lt;FileUpload[]&gt;;
  
    pushFileToStorage(fileUpload: FileUpload, progress: {percentage: number}) {
      const storageRef = firebase.storage().ref();
      const uploadTask = storageRef.child(`${this.basePath}/${fileUpload.file.name}`).put(fileUpload.file);
  
      uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED,
        (snapshot) =&gt; {
          // in progress
          const snap = snapshot as firebase.storage.UploadTaskSnapshot
          progress.percentage = Math.round((snap.bytesTransferred / snap.totalBytes) * 100)
        },
        (error) =&gt; {
          // fail
          console.log(error)
        },
        () =&gt; {
          // success
          fileUpload.url = uploadTask.snapshot.downloadURL
          fileUpload.name = fileUpload.file.name
          this.saveFileData(fileUpload)
        }
      );
    }
  
    private saveFileData(fileUpload: FileUpload) {
      this.db.list(`${this.basePath}/`).push(fileUpload);
    }
  }
  </code></pre>
  
  <h2>uploadingpage.component.ts</h2>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { AngularFireAuth } from 'angularfire2/auth';
  import { AngularFireDatabase, AngularFireObject } from 'angularfire2/database';
  import { Observable } from 'rxjs/Observable';
  import * as firebase from 'firebase';
  import { FirebaseAuthService } from '../auth/firebase-auth.service';
  
  import { ItemService } from '../services/item.service';
  import { UploadFileService } from '../services/upload-file.service';
  import { FileUpload } from './fileupload';
  
  @Component({
    selector: 'app-uploadingpage',
    templateUrl: './uploadingpage.component.html',
    styleUrls: ['./uploadingpage.component.css']
  })
  export class ProfileComponent implements OnInit {
  
    //for image
    selectedFiles: FileList;
    currentFileUpload: FileUpload;
    progress: {percentage: number} = {percentage: 0};
  
  
    constructor(
      private afDb: AngularFireDatabase,
      private _auth: FirebaseAuthService,
      private itemService: ItemService,
      private uploadService: UploadFileService 
    ) { }
  
    ngOnInit() {
    }
  
    //for image
    selectFile(event) {
      this.selectedFiles = event.target.files;
    }
   //for image
    upload() {
      const file = this.selectedFiles.item(0)
      this.currentFileUpload = new FileUpload(file);
      this.uploadService.pushFileToStorage(this.currentFileUpload, this.progress);
    }
  
    signOut(){
      this._auth.signOut();
      window.location.href = "";    
    }
  }
  </code></pre>
  
  <h2>displaypage.component.ts</h2>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
        //additional imports
        import { ItemService } from '../services/item.service';
        import {FileUpload} from '../uploadingpage/fileupload';
        import {UploadFileService} from '../services/upload-file.service';
        import { AngularFireDatabase, AngularFireList } from 'angularfire2/database'; 
        import * as firebase from 'firebase';
  
        @Component({
          selector: 'app-admin',
          templateUrl: './displaypage.component.html',
          styleUrls: ['./displaypage.component.css']
        })
        export class DisplaypageComponent implements OnInit {
  
          fileUploads: AngularFireList&lt;FileUpload[]&gt;;
  
          constructor(private itemService: ItemService, private uploadService: UploadFileService) { }
  
          ngOnInit() {
            this.itemService.getItems().subscribe(items =&gt; {
              this.items = items;
            });
           this.uploadService.getFileUploads().valueChanges().subscribe(result=&gt;{
               this.fileUploads = result;
           });
          }
  
        }
  </code></pre>
  
  <p>Now while I can upload an image and retrieve it from the database, but I keep getting an error in my terminal showing
  <code>Type 'FileUpload[][]' is not assignable to type 'AngularFireList&lt;FileUpload[]&gt;</code>
  <code>Property 'query' is missing in type 'FileUpload[][]'.</code></p>
  
  <p>Any idea regarding why this is happening? </p>
  
  <p>Any kind of help would be greatly appreciated. Thanks.</p>