使用YoutubeAPI v3在AngularJS中提供服务
Services in AngularJS with YoutubeAPI v3
我以前使用过一次服务(仍然不是很擅长),我已经遇到了很多问题,所以知道我要问(我认为我的问题很简单:))
我需要得到一些ChannelDetails与使用YoutubeApi v3。
我的服务:
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;
});
}
}]);
then my controller:
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工厂方法返回一个值。
我需要在URL中实现channelname以获得具体的详细信息。
似乎可以。
服务: appApi.factory('ServiceAPI', ['$http', function($http) {
var factory = {};
factory.channelDetails = function(channelname, success, error){
var promise = $http.get('https://www.googleapis.com/youtube/v3/channels?part=contentDetails&forUsername='+channelname+'&key=AIzaSyDQv-WpATIWLinCB3H_sH4W1sKx7plyvRA')
if(success){
promise.success(success);
}
if(error){
promise.error(error);
};
}
return factory;
}]);
控制器:
var appApi = angular.module('YoutubeAPI', ['ngRoute'])
appApi.controller('youtubeCTRL', ['$scope','$http','$q','ServiceAPI', function ($scope, $http, $q, ServiceAPI) {
$scope.channel = [];
$scope.video = [];
var pagetokenarr = [];
//GET Id on channelname
$scope.saveNewchlName = function () {
var channelname = $scope.newchlName;
ServiceAPI.channelDetails(channelname, 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;
});
});
}
相关文章:
- AngularJS-需要在index.html页面中访问来自服务的数据
- 在AngularJS服务中使用$http回调
- 使用服务(AngularJS)在控制器之间共享数据
- 从AngularJS中的另一个文件中的控制器访问服务
- AngularJS 1.5.x服务未正确绑定,并且未在控制器中更新
- AngularJS:使用维基百科API的web服务
- 如何在angularjs上提供服务
- AngularJS中介服务中的解约
- 使用角度模态服务(AngularJS)自定义模态
- 从服务 AngularJS + TypeScript 调用指令
- 无法使用服务AngularJS - “无法读取未定义的属性'原型'”
- 将 localStorage 值传递到服务 angularjs 中
- $broadcast不是从服务(AngularJS)触发的
- 在服务angularjs中的函数中使用$scope
- 配置依赖于另一个服务angularjs的服务
- 在服务AngularJS中存储变量
- forEach内部提供商服务AngularJS
- 从控制器传递多个参数到服务angularjs
- 无法从工厂向服务angularJS返回值
- 只保存服务器上更改的对象:Restful服务+angularjs