Loading data from a json file with an Interface

Question

I'm writing a little ionic app for learning purposes and I would like to load data from a json file and assign it to an Interface that describes the data. But I'm struggling with getting it the right way:

import { Component } from "@angular/core"; 
import { HttpClient} from "@angular/common/http";

export interface PhonebookEntry {
    name:           string,
    telephone:      string, 
    description:    string
}

@Component({
    selector:    'page-phonebook',
    templateUrl: 'phonebook.html'
})
export class PhonebookPage {

    entries: Array<PhonebookEntry>;

    constructor(public http: HttpClient) {
        this.load_entries('assets/json/phonebook.json');
    };

    load_entries(filePath: string) {
        return this.http.get(filePath)
            .subscribe(
                data => this.entries = data
            );
    };

}

I think only the line data => this.entries = data is wrong (also the IDE is telling me that), but I don't know to do this right and can't find documentation describing the correct way. If there actually is some I would be glad to know where I can find ressources about this.

Sachila Ranawaka · Accepted Answer · 2017-12-21 15:33:06Z

1

subscribe return the response as an object, not as an array. So entries type should be changed.

entries: PhonebookEntry;

In the subscribe, need to assign a type for response data.

load_entries(filePath: string) {
    return this.http.get(filePath)
        .subscribe(
            (data: PhonebookEntry) => this.entries = data // or use any type
        );
};

Demo

answered Dec 21, 2017 at 15:33

Sachila Ranawaka

41.6k8 gold badges62 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Loading data from a json file with an Interface

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related