错误：“'JSON'类型不存在属性'.get'（HTML / Javascript / Angular2 / Typescript）

Question

Screenshot of error:

Code where error exists:

import {Component, OnInit} from 'angular2/core';
import {Router} from 'angular2/router';
import {Hero} from './hero';
import {HeroService} from './hero.service';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
import {HeroesComponent} from './heroes.component';
import {HeroDetailComponent} from './hero-detail.component';
import {DashboardComponent} from './dashboard.component';
import {SpreadSheetComponent} from './spreadsheeteditall.component';
import {SwitchUsersComponent} from './SwitchUsers.component';
import {BiddingPageComponent} from './BiddingPage.component';
import { Injectable } from 'angular2/core';
import { Jsonp, URLSearchParams } from 'angular2/http';



@Component({
  selector: 'SearchAndDisplayComponent',
  templateUrl: 'app/SearchDisplay.component.html',
  styleUrls: ['app/SearchDisplay.component.css'],
  providers: [HeroService],
  directives: [ROUTER_DIRECTIVES]
})

@Injectable()

export class SearchAndDisplayComponent{
   constructor(private jsonp: JSON) {}
  search (term: string) {
   // let ebayURL = 'http://en.wikipedia.org/w/api.php';
    var params = new URLSearchParams();
params.set('search', term); // the user's search value
    params.set('action', 'opensearch');
    params.set('format', 'json');
    params.set('callback', 'JSONP_CALLBACK');
    // TODO: Add error handling
    return this.jsonp
               .get({ search: params })
               .map(request => <string[]> request.json()[1]);
  }


}

Context of the problem: I am trying to create a search bar for a website that is basically a clone of ebay.

Here is a question I posted earlier with links to the whole project (plunker/full project zipped)

Search bar that hides results that aren't typed into it

HTML code of how I'm trying to display it by the click of a button next to the search bar:

<button (click)="search(term)">Search</button>

Answer 1

You need to inject the Jsonp class instead of the JSON one in the constructor. The Jsonp object will allow you to execute JSONP requests.

import {Jsonp} from 'angular2/http';

(...)
export class SearchAndDisplayComponent{
  constructor(private jsonp: Jsonp) {} // <-----

  (...)
}

Answer 2

JSON is javascript namespace object. You have imported Jsonp from the module angular2/http, so in constructor of yout service change JSON to Jsonp. And don't forget to add Jsonp provider to some component above at component hierarchy.