代码之家 › 专栏 › 技术社区 › cute_programmer

Angular2:如何将每个对象迭代到包含对象数组数据的可观察对象?

observable angular

cute_programmer · 技术社区 · 8 年前

大家好,我刚刚开始学习(具体升级)Angular 2,我有几个问题。如何迭代数组对象的可观察对象中的每个对象?

如果我从“api/v1/example”中获取数据,这就是我检索到的内容,而且它确实在工作。

// my arrayObject
[
{
    "userID": 12,
    "username": "admin1",
    "password": "admin2"
},
{
    "userID": 13,
    "username": "admin21",
    "password": "admin32"
},
{
    "userID": 14,
    "username": "admin221",
    "password": "admin72"
},
{
    "userID": 15,
    "username": "admin451",
    "password": "admin652"
},
{
    "userID": 16,
    "username": "admin561",
    "password": "admin1222"
},
{
    "userID": 17,
    "username": "admin154",
    "password": "admin572"
},
{
    "userID": 127,
    "username": "admin1254",
    "password": "admin5721"
}
]

正如我之前所说的,我只是在学习angular 2,所以我尝试使用这个虚拟数据来测试observable,但在我的代码中,我无法真正迭代对象中的每个数据,这是我迄今为止所尝试的

 myData: Any[];

 constructor(private _http: HttpClient) { }

 ngOnInit() {
     this._http.get<Any[]>("api/v1/example")
         .map(data => data["username"])
         .subscribe(data => console.log(data));
 }

但我没有得到任何数据,我甚至试过过滤器

filter(data => data["id"] > 0)

但仍然失败, 但是如果我像这样立即订阅,我可以检索数据

 ngOnInit() {
     this._http.get<Any[]>("api/v1/example")
         .subscribe(data => console.log(data));
 }

我使用java中的流作为参考,但我认为它们的工作方式不同,提前谢谢大家

1 回复 | 直到 8 年前

user1608841 8 年前

请尝试以下代码:

import { Observable } from 'rxjs/Observable';
import { from } from 'rxjs/observable/from';
import { of } from 'rxjs/observable/of';
import { map } from 'rxjs/operators';

    this._http.get<Any[]>("api/v1/example").pipe(
          map(d => { return d["username"]; })
        ).subscribe(data => console.log(data));

参考工作 stackblitz

推荐文章

Anjil Dhamala · 在收到特定http状态时重试http调用

8 年前

simonberry · 取消RXJS FlatMap链上的订阅

8 年前

user9487981 · 可以激活防护装置并使用角度为5的可见光

8 年前

makat · 角度5 HTTP请求间隔使用可观察值,而值可能会更改

8 年前

Gissipi_453 · 在RxJava 2中的可观察对象中发出字符串数组时出现“不兼容类型”错误

8 年前

Jake Shakesworth · 如何将一个可观察对象映射到另一个可观察对象

8 年前

Nomura Nori · 许诺仅当使用了4个以上的承诺时,才获得“Access Control Allow Origin”

8 年前

MindlessRouse · 路由解析程序在没有订阅的情况下不触发可观察

8 年前

DevMike · 在角度服务中,如果在可观测范围内使用贴图功能,那么假设贴图功能保证同步是否正确?

8 年前

Arun Prasad E S · 角度5,离子3-【ts】类型“void”不可分配给类型“Observable<Post[]>”

8 年前