在 Angular JS 服务中调用 YouTube API 请求

Calling YouTube API request in Angular JS service

本文关键字:YouTube API 请求 调用 Angular JS 服务      更新时间:2023-09-26

我在创建基于"搜索词"进行简单搜索的 Youtube 服务时遇到问题。我想做的是允许控制器调用我的YouTube服务(即searchVideo("dogs"))并获取一个视频ID,作为一个字符串,回来。

此时,我注意到在请求完成执行之前返回了请求视频 ID。由于不熟悉JS,我想要一个例子来说明如何让我的searchVideo()函数正确返回requestVideoId(在请求完成后)。

(function () {
'use strict';
var serviceId = 'youtubeService';
angular.module('app').factory(serviceId, ['common', youtubeService]);
function youtubeService(common) {
    var service = {
        searchVideo: searchVideo
    };
    return service;
    function searchVideo(searchText) {
        var requestVideoId = "";
        var request = gapi.client.youtube.search.list({
            q: searchText,
            part: 'snippet'
        });
        request.execute(function(response) {
            var responseList = response.result;
            console.log(responseList.items[0].id.videoId);
            requestVideoId = responseList.items[0].id.videoId;
        });
        console.log(requestVideoId);
        return requestVideoId;
    }
}
})();

我已经检查了这个问题...优酷异步函数...但我想保留搜索视频()函数。我可能错过了一些东西。提前谢谢。

searchVideo应该返回一个将来解析的promise。像这样:

 function searchVideo(searchText) {
        var defer=$q.defer();
        var requestVideoId = "";
        var request = gapi.client.youtube.search.list({
            q: searchText,
            part: 'snippet'
        });
        request.execute(function(response) {
            var responseList = response.result;
            console.log(responseList.items[0].id.videoId);
            requestVideoId = responseList.items[0].id.videoId;
            defer.resolve(requestVideoId);
        });
        console.log(requestVideoId);
        return defer.promise;
    }

现在您可以使用承诺 API 在解析承诺时注册回调:

youtubeService.searchVideo('test') .then(function(requestVideoId) { // can access the id here});

了解什么是承诺以及承诺如何在 Angular 中发挥作用。