javascript - Angular 2-对象属性作为未定义返回,但它们存在

原文 标签 javascript angular typescript

我有这个问题。我正在使用Angular并调用API以获取内部具有其他对象的对象。问题是我无法访问那些对象,因为它们以未定义的形式返回。但是,将它们记录在控制台中(使用Google Chrome浏览器)后,对象实际上就在那里。

这些是我的代码的相关片段:

问卷调查表

export class QuestionnaireComponent extends BaseComponent {

    questionnaires: Models.Survey.Rootobject;
    ...
    ngOnInit() {

        ...do stuff...

        Observable.forkJoin(this.service.getAllQuestionnaires())
        .subscribe(res => {

            this.questionnaires = res[0];

            console.log(this.questionnaires);
            console.log(res[0]);
            console.log(this.questionnaires.questionnaireItems);

            this.numberOfQuestionnaires = this.questionnaires.questionnaireItems.length;

            ...do more stuff...

        });
    }
    ...
}


问卷调查服务

...code...

getAllQuestionnaires() {

    return this.http.get<Models.Survey.Rootobject>('/api/v1/xmlquestionnaires').map(res => res[0]);
}


调查

declare namespace Models.Survey {

    ...more interfaces...

    export interface QuestionnaireItem {
        id: string;
        name: string;
        order: string;
        description: string[];
        finalText: string[];
        questionGroups: QuestionGroup[];
        questions: Question[];
        toRandomize: string;
    }

    export interface Rootobject {
        questionnaireItems: QuestionnaireItem[];
    }

    export interface Wrapper {
        rootobject: Rootobject;
    }

}


而“ console.log(x)”的结果如下:

Resultados logging

QuestionnaireItems在对象中,但是直接访问它将返回未定义的。

您知道问题出在哪里,我该如何解决?

非常感谢你!

最佳答案

看来您的方法getAllQuestionnaires()返回的是Wrapper对象而不是Rootobject

在这种情况下,将“ .rootobject”添加到方法EDIT:并修复类型就足够了,也许像这样:

getAllQuestionnaires() {
    return this.http
        .get<Models.Survey.Wrapper>('/api/v1/xmlquestionnaires')
        .map(res => res[0].rootobject);
}

关于javascript - Angular 2-对象属性作为未定义返回,但它们存在,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42084772/

相关文章:

http - 如何从Observables值构造数据,并在HTTP调用后返回Observable <Response>?

typescript - Angular 2 RC4 路由器供应商

javascript - 在WordPress中加载更多帖子Ajax按钮

angular - Angular 2 项目中的 Protocol Buffer

javascript - 如何在 Angular 2类型脚本中附加带有参数的url?

javascript - 以 Angular 2 路由

javascript - 使用 Angular 4 上传文件

javascript - EcmaScript 6 的非法构造函数

javascript - 使用向上/向下箭头键调用函数(和传递参数)

javascript - 尝试将事件记录到乱码时,javascript中出现非法字符语法错误