Make GET call to REST service with parameters in Angular 2

Question

I am trying to make a GET call to the YouTube Web API but I cannot figure out how to pass parameters using the http.get function. I have used fiddler and made sure the request is being made. I am currently getting a 400 error saying that I am missing a the parameter "Part". How can I modify my code to include the required parameters in my request?

private _url = 'https://www.googleapis.com/youtube/v3/';
private _key = '';

getPlaylistVideos(playlistId, pageToken){

    var url = this._url + "playlistItems";
    var options =  { part: 'snippet', maxResults: 50, playlistId: playlistId, key: this._key, pageToken: pageToken }

    return this.http.get(url, options);

}

score 2 · Accepted Answer · answered Jul 21 '16 at 06:51

You need to include the search params in to your request. I think this will work for you:

getPlaylistVideos(playlistId, pageToken) {
    let url = `${this._url}playlistItems`,
        options =  { part: 'snippet', maxResults: 50, playlistId: playlistId, key: this._key, pageToken: pageToken }, 
        params = URLSearchParams();

    for (let key in options) params.set(key, options[key);

    return this.http.get(url, {search: options});
}

You create the URLSearchParams using the set method you can find the full documentation here

score 0 · Answer 2 · edited May 23 '17 at 10:31

0

Please have a look at the already asked & solved question regarding AngularJS & YouTube V3 API. See here thanks to @Sandeep Sukhija.

Anyhow, about the missing parameter part, add it to the request ex: part: 'snippet'

Example code :

function getPlaylistVideos(playlistId, pageToken) {
    // pass the page token as a parameter to the API
    $.get('https://www.googleapis.com/youtube/v3/playlistItems', { part: 'snippet', maxResults: 50, playlistId: playlistId, key: key, pageToken: pageToken })
}

How to use the part parameter

The part parameter is a required parameter for any API request that retrieves or returns a resource. The parameter identifies one or more top-level (non-nested) resource properties that should be included in an API response. For example, a video resource has the following parts:

snippet contentDetails fileDetails player processingDetails recordingDetails statistics status suggestions topicDetails

edited May 23 '17 at 10:31

Community

1
1

answered Jul 20 '16 at 21:03

daan.desmedt

3,752
1
19
33

It should be a comment. – developer033 Jul 20 '16 at 21:04
No, it's an answer to his question about the missing `part`. Little bit too much information also to post as a comment. – daan.desmedt Jul 20 '16 at 21:05
Now it's an answer, when I comment it was just the link. No problem :) – developer033 Jul 20 '16 at 21:06
This won't work in Angular 2 with Typescript will it? I know that this answer will work for Angular 1 – Aaron Jul 20 '16 at 21:25

Make GET call to REST service with parameters in Angular 2

2 Answers2