GitHub API с Angular - как получить публичные репозиции пользователей?

Я пытаюсь распечатать счет репозиториев каждого члена угловой организации на GitHub. Мне уже удалось распечатать все имена пользователей, но я не могу распечатать репозитории и не знаю, что их вызывает.GitHub API с Angular - как получить публичные репозиции пользователей?

Вот мой HTML:

<!DOCTYPE html> 
<html lang="en" ng-app="myApp"> 
<head> 
    <meta charset="utf-8"> 
    <title>GitHub App</title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="app.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
    <script src="app.js"></script> 
    <script src="cntrlr.js"></script> 
</head> 
<body ng-controller="myctrl"> 
    <h1>GitHub users ranking</h1> 
    <h3>{{org.login}}</h3> 
    {{user.public_repos}} 
<p ng-repeat="user in memberall">{{user.login}}, {{user.public_repos}}</p> 
</div> 
</body> 
</html>

И JS:

var myAppModule = angular.module('myApp', []) 
.controller('myctrl', ['$scope', '$http', function($scope, $http){ 
    $http({ 
      method: 'GET', 
      url: 'https://api.github.com/orgs/angular'+ '?access_token=xxx' }) 
      .then(function(response) { 
      $scope.org = response.data; 
     }, function(error) { 
      displayError("Something went wrong"); 
     }); 

    $http({ 
      method: 'GET', 
      url: 'https://api.github.com/orgs/angular/members'+ '?access_token=xxx' }) 
      .then(function(response) { 
      $scope.members = response.data; 
     }, function(error) { 
      displayError("Something went wrong"); 
     }); 

    $http({ 
      method: 'GET', 
      url: 'https://api.github.com/orgs/angular/members?page=2'+ '&access_token=xxx' }) 
      .then(function(response) { 
      $scope.members2 = response.data; 
     }, function(error) { 
      displayError("Something went wrong"); 
     }); 

    $http({ 
      method: 'GET', 
      url: 'https://api.github.com/orgs/angular/members?page=3'+'&access_token=xxx' }) 
      .then(function(response) { 
      $scope.members3 = response.data; 
     }, function(error) { 
      displayError("Something went wrong"); 
     }); 

    $http({ 
      method: 'GET', 
      url: 'https://api.github.com/users' + '?access_token=xxx' }) 
      .then(function(response) { 
      $scope.user = response.data; 
      $scope.memberall = $scope.members.concat($scope.members2, $scope.members3); 
       for(var index = 0; index < $scope.memberall.length; index++) { 
        $http.get("https://api.github.com/users/" + $scope.memberall[index].login + '?access_token=xxx'); 
        $scope.repos = response.data[index].public_repos; 
       } 
      }, function(error) { 
      displayError("Something went wrong"); 
}); 
    }]);

Я был бы очень признателен, если кто-то скажет мне, что ошибка я сделал.

источник

2016-08-08 summerfreeze

Вы просто вызываете $ http, но не обрабатываете возвращенные данные.

$http.get("https://api.github.com/users/" + $scope.memberall[index].login).then(function(res) { 
    console.log(res.data.public_repos); 
});

Это дает вам идентификационные данные.

Вы можете получить фактические операции РЕПО на этот адрес (замените «ххх» с маркером):

'https://api.github.com/users/' + $scope.memberall[index].login + '/repos'

EDIT: Ключевым моментом здесь является использование array.forEach(), так что вы не должно играть с индексами массива (который не будет работать с простым циклом, так как $ HTTP «создает» новый масштаб и переменный я не доступен внутри)

var myAppModule = angular.module('myApp', []) 
 
.controller('myctrl', ['$scope', '$http', function($scope, $http){ 
 
    $http({ 
 
      method: 'GET', 
 
      url: 'https://api.github.com/orgs/angular'+ '?access_token=xxx' }) 
 
      .then(function(response) { 
 
      $scope.org = response.data; 
 
     }, function(error) { 
 
      displayError("Something went wrong"); 
 
     }); 
 

 
    $http({ 
 
      method: 'GET', 
 
      url: 'https://api.github.com/orgs/angular/members'+ '?access_token=xxx' }) 
 
      .then(function(response) { 
 
      $scope.members = response.data; 
 
     }, function(error) { 
 
      displayError("Something went wrong"); 
 
     }); 
 

 
    $http({ 
 
      method: 'GET', 
 
      url: 'https://api.github.com/orgs/angular/members?page=2'+ '&access_token=xxx' }) 
 
      .then(function(response) { 
 
      $scope.members2 = response.data; 
 
     }, function(error) { 
 
      displayError("Something went wrong"); 
 
     }); 
 

 
    $http({ 
 
      method: 'GET', 
 
      url: 'https://api.github.com/orgs/angular/members?page=3'+'&access_token=xxx' }) 
 
      .then(function(response) { 
 
      $scope.members3 = response.data; 
 
     }, function(error) { 
 
      displayError("Something went wrong"); 
 
     }); 
 

 
    $http({ 
 
      method: 'GET', 
 
      url: 'https://api.github.com/users' + '?access_token=xxx' }) 
 
      .then(function(response) { 
 
      $scope.user = response.data; 
 
      $scope.memberall = $scope.members.concat($scope.members2, $scope.members3); 
 
       $scope.memberall.forEach(function(value, index) { 
 
        $http.get("https://api.github.com/users/" + value.login + '?access_token=xxx').then(function(res) { 
 
        //console.log(res.data.public_repos); 
 
        value.nbrRepos = res.data.public_repos; 
 
        }); 
 
       }) 
 
      }, function(error) { 
 
      displayError("Something went wrong"); 
 
}); 
 
    }]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myctrl"> 
 
<h1>GitHub users ranking</h1> 
 
    <h3>{{org.login}}</h3> 
 
    {{user.public_repos}} 
 
<p ng-repeat="user in memberall">{{user.login}}, {{user.nbrRepos}}</p> 
 
</div>

источник

2016-08-08 12:06:45 gyc

Большое спасибо, ваш код печатает счет репозиториев в консоли, но он все еще ничего не делает в HTML, и я хочу показать количество репозиториев рядом с логинами. – summerfreeze

@Dorota Я отредактировал фрагмент, чтобы он показывал количество репозиций на одного пользователя. – gyc

Сэр, ты только что сделал свой день. Большое спасибо. – summerfreeze

GitHub API с Angular - как получить публичные репозиции пользователей?

ответ

Смежные вопросы