NativeScript和Observable

我目前是Nativescript和Angular的新手。我已经使用laravel创建了一个API，它运行良好。现在，我正在尝试连接NativeScript/Angular中的API并从中获取数据。我遵循本教程作为指导

我的API是用Laravel中的PHP构建的，我的调用在Postman中运行良好。我也能够获取som数据，但我不能以HTML格式返回它

我的服务

导出公共项目服务{
getItems（）：可观察{
const authToken="2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2 2.2 2.2 2.2.2 2.2 2.2 2.2 2.2 2.2 2.2 2.2.2 2.2.2.2.2.2.2.2 2.2.2.2 2.2 2.2 2 2.2.2 2 2.2 2.2 2.2.2.2 2.2.2.2 2.2.2.2.2.2.2.2 2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.2.NWD4QA64也是2月2日，北京市政府在一份8月8日的BZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZZBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBQSBK7_g8iLVI5vQlv6slrIe2YSbABkHzzCGndFX-SMZKUGB8ANMORGP8RJ5Y5HXE6PJG8NN8CYIH5EDNDLWK0P4ZK2Z8788ZYX41PDB1OQR2GO0-PBJCDTGDYXU hy49(SO 4VSF8LPL7VYHV7W)KGV7JC7JU3XM4HRLUG56K8CM1KEFV0GNYBUFFOLFV2HAEGC(H2A65O5NUUZG)(RPEPRSB30;(2;)V3; 8; H7JJU3H7JJJU3H7JU3H3H3H7JJJJ0H7H8K8; JJJJ；
常量URL=”http://10.0.2.2:8000/api/source";
/*返回this.http.get(
网址，
{headers:new-HttpHeaders（）.append（“Authorization”，`Bearer${authToken}'）}
)*/
const res=this.http.get(
网址，
{headers:new-HttpHeaders（）.append（“Authorization”，`Bearer${authToken}'）}
)
console.log（）
返回res；
}
getItem（id）{}
/*
getItem（id:编号）：Item{
返回此.items.filter（（item）=>item.id==id）[0]；
}
*/
}

我的组件

导出类ItemsComponent实现OnInit{
公共物品$：可见；
构造函数（私有项服务：项服务）{}
ngOnInit（）：void{
this.itemService.getItems（）；
console.log（this.itemService.getItems（））
}
}

我的模板

<StackLayout class="page">
<ListView height="300" [items]="items$ | async" class="list-group">
    <ng-template let-item="item">
        <label [text]="item.data.first_name" class="list-group-item"></label>
    </ng-template>
</ListView>
</StackLayout>

终点站

---

由于

此.itemService.getItems（）返回一个可观察的项目，因此您必须在您的typescript文件中订阅它，或者在模板上使用
异步
管道

使用
订阅
：

items;

constructor() {
  this.itemService.getItems().subscribe(res => {
    this.items = res;
  })
}

// in your template (Label here is just an example)

<Label [text]="items"></Label>

由于
this.itemService.getItems（）
返回一个可观察的对象，因此您必须在您的typescript文件中订阅它，或者在模板上使用
async
管道

使用
订阅
：

items;

constructor() {
  this.itemService.getItems().subscribe(res => {
    this.items = res;
  })
}

// in your template (Label here is just an example)

<Label [text]="items"></Label>

请使用适当的内容更新模板（看起来您只是在其中复制粘贴的组件类型脚本）。请使用适当的内容更新模板（看起来您只是在其中复制粘贴的组件类型脚本）。您好，谢谢：）。这返回我[对象，对象]。我已经更新了我的模板示例。我不知道这是我的模板还是我的服务？@MartinHartmann查看传入的数据结构，您可能必须执行
（items$| async）？.data
因为数组似乎是
data
objectworked的一部分！它没有那么漂亮，但现在我知道它可以工作了，我有一些东西要处理：）-Thank.Hi，Thank:）。这会返回我[object，object]。我已经更新了我的模板示例。我不知道这是我的模板还是我的服务？@MartinHartmann查看传入的数据结构，您可能必须执行
（items$| async）？.data
因为数组似乎是
data
对象的一部分，所以工作起来很好！它没有那么漂亮，但现在我知道它工作起来了，我有一些东西要处理：）-谢谢。