Question

我正在编写一个用于学习目的的小型离子应用程序，我想从json文件加载数据并将其分配给描述数据的接口。但我正在努力让它以正确的方式：

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
            );
    };

}

我认为只有行data => this.entries = data是错的（IDE也告诉我这一点），但我不知道这样做是对的，也找不到描述正确方法的文档。如果确实有一些我会很高兴知道在哪里可以找到关于此的资源。

Answer 1

subscribe将响应作为对象返回，而不是作为数组。因此应更改entries类型。

entries: PhonebookEntry;

在订阅中，需要为响应数据指定一个类型。

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

Demo

使用Interface从json文件加载数据

1 个答案: