Can't resolve all parameters -getting this error in browser angular2

I am trying to create a movie finder website using api key .Everything looks perfect as far as code as well as the api key -i could access the values just by hitting the api request but getting error in browser.Appreciate if some one can help me

Error:

Error Image

This is My movies.service.ts

 import {Injectable} from '@angular/core'; import {Jsonp,JsonpModule} from '@angular/http'; import 'rxjs/Rx'; Injectable() export class MovieService { apikey:string; constructor(private _jsonp:Jsonp) { this.apikey='##'; console.log('Movie Service Initialized'); } getPopular() { return this._jsonp.get('https://api.themoviedb.org/3/discover/movie?callback=JSONP_CALLBACK&sort_by=popularity.desc&api_key=##') .map(res=>res.json()); } } 

This is my movies.components.ts where i am calling the service

import { Component } from '@angular/core'; import {MovieService} from 'app/services/movies.service'; @Component({ selector: 'Movies', templateUrl: 'movies.components.html', }) export class MoviesComponent { constructor(private _movieservice:MovieService) { this._movieservice.getPopular().subscribe(res=>{ console.log(res.results) }); } } 

This is my app.module.ts

import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule,JsonpModule } from '@angular/http'; import { AppComponent } from './app.component'; import {MoviesComponent} from 'app/components/movies/movies.components'; import {MovieService} from 'app/services/movies.service'; @NgModule({ declarations: [ AppComponent, MoviesComponent, ], imports: [ BrowserModule, FormsModule, HttpModule, JsonpModule, ], providers: [MovieService], bootstrap: [AppComponent] }) export class AppModule { }