javascript 以角度 6 映射元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/50527027/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Map elements in angular 6
提问by vedika shrivas
JSON
JSON
{ success: true, data {...}, calendar {...}
Component
零件
import { Component, OnInit } from '@angular/core';
import {MonthlyViewService} from "../../../monthlyView.service";
import 'rxjs/add/operator/map';
@Component({
selector: 'app-calendar',
templateUrl: './calendar.component.html',
styleUrls: ['./calendar.component.css']
})
export class CalendarComponent implements OnInit {
constructor(private monthlyViewService: MonthlyViewService) {}
ngOnInit() {
this.monthlyViewService.getMonthlyData().subscribe(res => {
let data = res.map(res => res.data);
console.log(data);
})
}
}
In Above code,i want access data,calendar data from response and store it into different array. I'm getting error on map - map does not exist on type object . Any solution
在上面的代码中，我想从响应中访问数据、日历数据并将其存储到不同的数组中。我在地图上遇到错误 - 类型对象上不存在地图。任何解决方案
回答by Sarthak Aggarwal
- Map Operator of RxJs
- RxJs 的 Map Operator
According to official documentation for Map operator of RxJs,
根据 RxJs 的 Map operator 的官方文档，
The Map operator applies a function of your choosing to each item emitted by the source Observable, and returns an Observable that emits the results of these function applications.
Map 运算符将您选择的函数应用于源 Observable 发出的每个项目，并返回一个发出这些函数应用程序结果的 Observable。
yourOservableCall().map(res=>res.json()).subscribe(data=>console.log(data))
- Map function of array
- 数组的映射函数
map() method creates a new array with the results of calling a provided function on every element in this array.
map() 方法创建一个新数组，其结果是对该数组中的每个元素调用提供的函数。
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
回答by Faisal
First of all, since RxJs 6, you have to import operator like this:
首先，从 RxJs 6 开始，你必须像这样导入操作符：
import { map } from 'rxjs/operators';
Secondly, you have to use pipebefore map:
其次，你必须使用pipebefore map：
ngOnInit() {
this.monthlyViewService.getMonthlyData().subscribe(res => {
let data = res.pipe( map(res => res.data) );
console.log(data);
})
}
回答by coder
Use resas anytype. Then if mapdoes exist in the type of actual response you will not get that error hopefully.
使用res的any类型。然后，如果map确实存在于实际响应的类型中，您希望不会收到该错误。
this.monthlyViewService.getMonthlyData().subscribe((res:any) => {
let data = res.map((res:any) => res.data);
console.log(data);
})
Hope this will work for you!
希望这对你有用！
回答by BlackBeard
This is considering yourObject (res) is of type object. Which you can verify by printing the resitself.
这是考虑到 yourObject (res) 是 object 类型。您可以通过打印res本身来验证。
It rightly says that map()doesn't exist on Objecttype. However, it does exists on Arraytype. So you could do the following (Source):
它正确地说map()在Object类型上不存在。但是，它确实存在于Array类型上。因此，您可以执行以下操作（源）：
let data = Array.from(yourObject).map(arrayElement => {
// do stuffs with arrayElement
});
回答by V5NXT
import { Component, OnInit } from '@angular/core';
import {MonthlyViewService} from "../../../monthlyView.service";
import { map } from 'rxjs/operators'
;
@Component({
selector: 'app-calendar',
templateUrl: './calendar.component.html',
styleUrls: ['./calendar.component.css']
})
export class CalendarComponent implements OnInit {
constructor(private monthlyViewService: MonthlyViewService) {}
ngOnInit() {
this.monthlyViewService.getMonthlyData().subscribe(res => {
let data = res.pipe(map(res =>
res.data);
)
console.log(data);
})
}
}There was a major update in usage of Observables in rxjs. The functions like map, catch etc should be now used a pipe and catch changes to catchError etc.
rxjs 中 Observables 的使用有了重大更新。map、catch 等函数现在应该使用管道并捕获对 catchError 等的更改。
For more details https://www.academind.com/learn/javascript/rxjs-6-what-changed/
欲了解更多详情 https://www.academind.com/learn/javascript/rxjs-6-what-changed/
