我有一个可观察的getPages()
,它返回一个数组,并且我试图过滤属性parent
等于“ id”的所有页面。但是我没有进步,因为我似乎无法访问该parent
。
Property 'parent' does not exist on type 'Page[]'
console.log(this.wordpressService.getPages());
(6) [{…}, {…}, {…}, {…}, {…}, {…}]
0: {id: 43, date: "2019-01-18T09:07:42", date_gmt: "2019-01-18T09:07:42", guid: {…}, modified: "2019-01-18T09:17:16", …}
1: {id: 28, date: "2019-01-14T20:46:39", date_gmt: "2019-01-14T20:46:39", guid: {…}, modified: "2019-01-16T12:19:20", …}
2: {id: 25, date: "2019-01-14T20:45:59", date_gmt: "2019-01-14T20:45:59", guid: {…}, modified: "2019-01-16T13:44:56", …}
3: {id: 16, date: "2019-01-14T20:37:42", date_gmt: "2019-01-14T20:37:42", guid: {…}, modified: "2019-01-16T12:18:42", …}
4: {id: 12, date: "2019-01-14T20:24:35", date_gmt: "2019-01-14T20:24:35", guid: {…}, modified: "2019-01-18T09:06:41", …}
5: {id: 4, date: "2019-01-14T19:57:45", date_gmt: "2019-01-14T19:57:45", guid: {…}, modified: "2019-01-16T12:19:13", …}
length: 6
__proto__: Array(0)
page-detail.component.ts(摘录)
export class PageDetailComponent implements OnInit {
pageId: Number;
filteredPage = [];
constructor(private route: ActivatedRoute, private wordpressService: WordpressService) {}
this.wordpressService.getPages()
.pipe(filter(page => page.parent === this.pageId))
.subscribe(page => this.filteredPage = page);
}
wordpress.service.ts(摘录)
import {HttpClient} from '@angular/common/http';
import {Page} from './page';
constructor(private http: HttpClient) {}
getPages(): Observable<Page[]> {
return this.http.get<Page[]>(`${this.API}/pages`);
}
page.ts界面(摘录)
export interface Page {
id: number;
date: string;
date_gmt: string;
guid: GUID;
modified: string;
modified_gmt: string;
...
parent: number;
}
我想最终得到一个包含所有页面过滤结果的新数组。但是我只是未定义或什么都没有,我假设这是因为此page.parent。尝试学习rxjs似乎无法弄清楚该怎么做。
答案 0 :(得分:4)
您需要添加地图运算符。我遇到表格错误,可以得出结论,您正在遍历整个对象。
this.wordpressService.getPages()
.pipe(map(pages => pages.filter((page) => page.parent === this.pageId)))
.subscribe(page => this.filteredPage = page);
希望有帮助