使用YoutubeAPI v3在AngularJS中提供服务

时间:2015-09-01 09:43:36

标签: javascript angularjs youtube-api

我曾经使用过一次服务(仍然不是很擅长),而且我已经遇到很多问题,所以知道我会问(我觉得我的问题很容易AF :))

我需要使用YoutubeApi v3获得一些ChannelDetails。

我的服务:

appApi.factory('ServiceAPI', ['$http', function($http) {

var factory = {};

    factory.channelDetails = function(channelname){
        return $http.get('https://www.googleapis.com/youtube/v3/channels?part=contentDetails&forUsername='+channelname+'&key=AIzaSyDQv-WpATIWLinCB3H_sH4W1sKx7plyvRA')
         .success(function(data) {
           return data;
         })
         .error(function(data) {
           return data;
         });
         }
}]);

然后我的控制器:

var appApi = angular.module('YoutubeAPI', ['ngRoute'])

appApi.controller('youtubeCTRL', ['$scope','$http','$q','ServiceAPI', function ($scope, $http, $q, ServiceAPI) {
    $scope.channel = [];

    //GET Id on channelname
    $scope.saveNewchlName = function () {

        var channelname = $scope.newchlName;

        $scope.channelDetails = function(channelname){

            ServiceAPI.channelDetails(channelname).success(function (data) {

                $scope.newchannelNames = {
                    channelName: $scope.newchlName,
                    channelId: data.items[0].id,
                    playlistId: data.items[0].contentDetails.relatedPlaylists.uploads
                };
                console.log($scope.newchannelNames)
                $http({
                    method: 'POST',
                    url: 'http://localhost:8080/api/resources/channelNames/',
                    data: $scope.newchannelNames,
                    dataType: 'json'
                }).success(function (data) {
                    $scope.channel.push(data);
                    console.log('SUCCESS!');
                    $scope.error = null;
                }).error(function (data, status) {
                    if (status == 401) {
                        $scope.error = "You are not authenticated to Post these data";
                        return;
                    }
                    $scope.error = data;
                });
    });
    }
}

我的问题是我一直遇到注射问题。现在我有一个说:提供商' ServiceAPI'必须从$ get factory方法返回一个值。

我需要在URL中实现channelname以获取具体细节。

1 个答案:

答案 0 :(得分:0)

这似乎有效。

服务:

HDR1;HDR2;HDR3;HDR4;HDR5
AAA1;BBB1;CCC1;DDD1;EEE1
AAA2;BBB2;;;EEE2
AAA3;BBB3;CCC3;DDD3;EEE3

控制器:

<ListBox.ItemTemplate>
                    <DataTemplate>
                        <Grid Margin="15,10,0,10" Height="80" Width="auto" Tag="{Binding .}">
                            <toolkit:ContextMenuService.ContextMenu>
                                <toolkit:ContextMenu Opened="ContextMenu_Opened">
                                    <toolkit:MenuItem Header="delete" Tag="{Binding .}" Click="Delete_MenuItem_Click" />
                                </toolkit:ContextMenu>
                            </toolkit:ContextMenuService.ContextMenu>