Question

哦，所以我是Angular n00b。我已经阅读了一些如何解决这个问题的指南，但我觉得我毕竟需要你的指导。

我设法创建了这个：

A（点击）=＆＃34; checkForList（）＆＃34;在一个按钮上发送一个http.get-request到我的PHP后端，后者生成json_encoded数据，我已经使用Angular管理到console.log并且工作得很好。意思是;我可以将数据收到我的Angular应用程序中。

我的服务如下：

getProjects() {
    return this.http.get("http://localhost/php-backend.php")
        .map(
            (response: Response) => {
                const data = response.json();
                return data;
            }
        )
        .catch(
            (error: Response) => {
                return Observable.throw("Something went wrong");
            }
        );
}

我在我的组件中有这个构造函数

constructor(private GetProjectList: GetProjectList) {}
    checkForList() {
        this.GetProjectList.getProjects()
            .subscribe(
                (projects: any[]) => console.log(projects),
                (error) => console.log(error)
    );
}

而不仅仅是console.logging数据。我想在DOM上的* ngFor循环中渲染数据。

这样的东西......是的，你得到它:)。

<ul>
    <li *ngFor="let projects for projectslist">{{ Name }}</li>
</ul>

如果你能帮助我将上述内容转换成我可以在DOM上呈现的东西，我会很高兴：）

Answer 1

首先必须在projectList上定义this。

class myComponent {
    public projectList;

    constructor(private GetProjectList: GetProjectList) {}

    checkForList() {
        this.GetProjectList.getProjects()
            .subscribe(
                (projects: any[]) => this.projectList = projects,
                (error) => console.log(error)
            );
    }
}

之后你可以渲染它：

<ul>
    <li *ngFor="let project of projectList">{{ project.name }}</li>
</ul>

Angular2 - 从PHP / Json中循环输出结果

1 个答案: