Angular Jsを使用して2レベルのjson配列を作成する

Question

まず、2つの部分からなるJsonを作成する必要があります。ApiRestから企業の名前を取得する必要があります.Jsonには企業名とパラメータを含むパラメータが返されます会社のメンバーを持つ各会社の住所。 firtsのAPIの残りはhttp://api1.getcompanyiesと戻りである `

[ 
    {name: Company1, 
    members: 
    { member1: 
     { 
      name: albert, 
      age: 16 
      }, 
     member2: 
      { 
      name:joan, 
      age:18 
      } 
    } 
    }, 
    {name: Company2, 
    members: 
    { member1: 
     { 
      name: albert, 
      age: 16 
      }, 
     member2: 
      { 
      name:joan, 
      age:18 
      } 
    } 
    } 
] 

：

[{ 
    "_links": { 
    "url": { 
     "href": "http://api.company.members/1" 
    } 
    }, 
    "name": "Company1", 
    }, 
    { 
    "_links": { 
     "url": { 
      "href": "http://api.company.members/2" 
     } 
    }, 
    "name": "Company2", 
    }, { 
    "_links": { 
     "url": { 
      "href": "http://api.company.members/3" 
     } 
    }, 
    "name": "Company3"} 

第2のAPI残り応答は次のとおりです。

{"employes": [ 
    { 
     "name": "Mickael Ciani", 
     "age": "16" 
    }, 
    { 
     "name": "Albert dd", 
     "age": "18" 
    } 
]} 

私が構築する必要があることJSONはこのようなものです最初に$ httpを入れ子にしてみましたが、うまくいきませんでした。

$http(firstApi) 
    .then(function(res) { 
      $scope.ob = {}; 
      angular.forEach(res.data.teams, function(value, key) { 
       var companyName = value.name; 
       $scope.ob[companyName] = {}; 
       $scope.ob[companyName].memberUrl = alue._links.url.href; 
       $scope.teams2.push(value.name); 
       $http(paramsPlayers) 
        .then(function(res2) { 
         // construct the array 
        }, 
        function() {} 
        ); 
       }); 
      return $scope; 
     }, 
     function() {} 
    ); 

は、私はネストされたHTTPを使用しない実行しようとしましたが、それでも最初のオブジェクトのcontructionが間違っているので、私は

$http(firstApi) 
    .then(function(res) { 
      $scope.ob = {}; 
      angular.forEach(res.data.teams, function(value, key) { 
       var companyName = value.name; 
       $scope.ob[companyName] = {}; 
       $scope.ob[companyName].memberUrl = alue._links.url.href; 
       $scope.teams2.push(value.name); 
       }); 
      return $scope; 
     }, 
     function() {} 
    ); 
$http(2apiparams) 
    .then(function(res2) { 
      //construct final json 
     }, 
     function() {} 
    ); 

あなたはこのために$q.allを使用する必要があり、すべての

Answer 1

のためにありがとうと思う動作しません。シナリオ。私はCompanyServiceという角サービスを作成し、同じ実装をテスト実装しました。お役に立てれば。このサービスは、アプリケーションで使用できます。これはあなたが望むものを実装

var testData = { 
 
    companies: [{ 
 
    "_links": { 
 
     "url": { 
 
     "href": "http://api.company.members/1" 
 
     } 
 
    }, 
 
    "name": "Company1" 
 
    }, { 
 
    "_links": { 
 
     "url": { 
 
     "href": "http://api.company.members/2" 
 
     } 
 
    }, 
 
    "name": "Company2" 
 
    }, { 
 
    "_links": { 
 
     "url": { 
 
     "href": "http://api.company.members/3" 
 
     } 
 
    }, 
 
    "name": "Company3" 
 
    }], 
 
    memebers: { 
 
    "employes": [{ 
 
     "name": "Mickael Ciani", 
 
     "age": "16" 
 
     }, 
 
     { 
 
     "name": "Albert dd", 
 
     "age": "18" 
 
     } 
 
    ] 
 
    } 
 
}; 
 
angular.module('app', []) 
 
    .factory('CompanyService', function($http, $q) { 
 
    var COMPANY_API = 'your company api url'; 
 
    var service = {}; 
 
    service.getCompanies = function() { 
 
     //comment this for real implementation 
 
     return $q.when(testData.companies); 
 
     //uncomment this for real api 
 
     //return $http.get(COMPANY_API); 
 
    }; 
 

 
    service.getMemebers = function(url) { 
 
     //comment this for real implementation 
 
     return $q.when(testData.memebers); 
 
     //uncomment this for real api 
 
     //return $http.get(url); 
 
    }; 
 

 
    service.getAll = function() { 
 
     return service.getCompanies() 
 
     .then(function(companies) { 
 
      var promises = companies.map(function(company) { 
 
      return service.getMemebers(company._links.url.href); 
 
      }); 
 

 
      return $q.all(promises) 
 
      .then(function(members) { 
 
       return companies.map(function(c, i) { 
 
       return { 
 
        name: c.name, 
 
        members: members[i].employes 
 
       }; 
 
       }); 
 
      }); 
 
     }); 
 
    }; 
 
    
 
    return service; 
 
    }) 
 
    .controller('SampleCtrl', function($scope, CompanyService) { 
 
    $scope.companies = []; 
 
    CompanyService.getAll() 
 
     .then(function(companies) { 
 
     $scope.companies = companies; 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app" ng-controller="SampleCtrl"> 
 
    <pre>{{ companies | json }}</pre> 
 
</div>