I try to program a function but somehow the error pops up: when I want to .map (res => res.json()); what did I do wrong here? I use the newest Angular Version.

import { In,json,angular,error-handling,syntax-error"/>
	














    

		

        

            
            时间戳
        

		

		

        
		

    
















	
首页  > 解决方案 > Angular 2：“可观察”类型上不存在错误属性“地图”'.ts(2339)

I try to program a function but somehow the error pops up:
when I want to .map (res => res.json());
what did I do wrong here? I use the newest Angular Version.


import { In












json - Angular 2：“可观察”类型上不存在错误属性“地图”'.ts(2339)

I try to program a function but somehow the error pops up:
when I want to .map (res => res.json());
what did I do wrong here? I use the newest Angular Version.


import { In





问题描述



I try to program a function but somehow the error pops up:
when I want to .map (res => res.json());
what did I do wrong here? I use the newest Angular Version.


import { Injectable } from '@angular/core';
//import {Http, Headers} from '@angular/http';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import {Contact} from './contact';
import 'rxjs/add/operator/map';

@Injectable({
  providedIn: 'root'
})
export class ContactService {

  constructor(private http: HttpClient) { }

  //retrieving ContactService
  getContacts()
  {
    return this.http.get('http://localhost:3000/api/contacts')
      .map(res => res.json());
  }
  //add contact method
  addContact(newContact) {
    var headers = new HttpHeaders();
    headers.append('Content-Type', 'application/json');
    return this.http.post('http://localhost:3000/api/contact', newContact, {headers:headers})
      .map(res => res.json());
  }

  //delete methods
deleteContact(id)
{
  return this.http.delete('http://localhost:3000/api/contact'+ id)
  .map(res => res.json());
}

}










I believe you're coming from an older version of RxJS and HttpClient. In the latest versions you need the following adjustments.


    

  1. If you're using newer versions of RxJS, the map should be applied using pipe.
    2. 



import 'rxjs/add/operator/map';    // <-- deprecated

import { map } from 'rxjs';        // <-- new

return this.http.delete('http://localhost:3000/api/contact'+ id).pipe(
  map(res => res.json())
);



    

  1. In the newer versions of Angular, the res.json() isn't required. The fetched data is already a JS object if it was one. So you can just say
    2. 



return this.http.delete('http://localhost:3000/api/contact'+ id);



标签： jsonangularerror-handlingsyntax-error


解决方案









我相信您来自旧版本的 RxJS 和 HttpClient。在最新版本中，您需要进行以下调整。


    

  1. 如果您使用的是较新版本的 RxJS，map则应使用pipe.
    2. 



import 'rxjs/add/operator/map';    // <-- deprecated

import { map } from 'rxjs';        // <-- new

return this.http.delete('http://localhost:3000/api/contact'+ id).pipe(
  map(res => res.json())
);



    

  1. 在较新版本的 Angular 中，res.json()不需要 。如果它是一个，那么获取的数据已经是一个 JS 对象。所以你可以说
    2. 



return this.http.delete('http://localhost:3000/api/contact'+ id);











推荐阅读