Map elements in angular 6

Question

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

Answer 1

First of all, since RxJs 6, you have to import operator like this:

import { map } from 'rxjs/operators';

Secondly, you have to use pipe before map:

ngOnInit() {
    this.monthlyViewService.getMonthlyData().subscribe(res => {
      let data = res.pipe( map(res => res.data) );
      console.log(data);
    })
  }