尝试使用 Angular 2 Http 从 Lumen 应用程序获取数据

Question

我正在学习 Angular 2，我想构建在 Lumen Framework 中具有后端和在 Angular 2 中具有前端的应用程序。

我已经创建了从数据库中获取数据的方法，我正在 return以这种方式处理它

return response()->json(['code' => 200, 'characters' => $characters])->header('content-type', 'application/json')->header('Access-Control-Allow-Origin', '*');

在 angular 2 应用程序中，我试图通过此代码

获取此数据

this.http.get(this.url)
        .toPromise()
        .then(response => response.json().data as Character[])
        .catch(this.handleError);

但是我得到了一个空数组，我认为 url 返回数据是可以的，而且该数据存在。

我尝试 return 类似 return->response('test') 的东西，我看到字符串测试存在。

Answer 1

因为你的 JSON 看起来像这样：

{
  "code":200,
  "characters":[
    {
      "id":1,
      "name":"tomek",
      "lead":"som‌ething about tomek",
      "created_at":"2017-03-06 17:34:45",
      "updated_at":"2017-03-06 17:34:45"
    }
  ]
}

当您尝试提取时：

response.json().data

..没有像 data 这样的属性。如果你想提取你的数组，你需要使用

response.json().characters

希望对您有所帮助！ :)

尝试使用 Angular 2 Http 从 Lumen 应用程序获取数据

Trying to get data from Lumen Application with Angular 2 Http

lumen

angular