<!--template bindings={
  "ng-reflect-ng-for-of": "[object Object],[object Object]"
}-->

import { Component, OnInit }                    from '@angular/core';

import { AngularFire, FirebaseListObservable }  from 'angularfire2';

import { FirebaseService }                      from './services/database.service';



export interface answers {
    $key: string;
    id: string;
    answer: string;
}

export interface questions {
    $key: string;
    question: string;
    id: string;
    name: string;
    answers: answers[];
}

export interface bus_image {
    $key: string;
    questions: questions[];
}

@Component({
    moduleId:       module.id,
    selector:       'app-root',
    templateUrl:    './app.component.html',
    styleUrls:      [ './app.component.css' ],
    providers:      [ FirebaseService ]
})



export class AppComponent implements OnInit {

    title = 'app works!';
    businessImage: bus_image;

    constructor(private _firebaseService:FirebaseService){}

    ngOnInit() {
        this._firebaseService.getBusImg().subscribe(businessImage => {
            this.businessImage = businessImage;
            console.log(businessImage);
        });
    }
}

<h1>{{title}}</h1>

<div *ngFor="let questions of businessImage">
    <h1>{{questions.question}}</h1>
    <ul>
        <li *ngFor="let answer of answers">
            {{answers.answer}}
        </li>
    </ul>
</div>