2017-01-16 11 views
0

私は2 jsonsからデータを取得し、テーブルでそれをリストアップしてみてください:角度NG-繰り返し連結2 JSON

第一 'names.json':

[ 
     { 
      "name": "AAAAAA", 
      "down": "False" 

     }, 

     { 
      "name": "BBBBBB", 
      "down": "False" 
     }, 
     { 
      "name": "CCCCC", 
      "down": "True" 
     } 
] 

2番目の 'data.json'

[ 
     { 
      "data": "15%" 
     } 
] 

Javascriptを:

app.service('service', function($http, $q){ 
      this.getNames = function() { 
    var datas = $http.get('data,json', { cache: false}); 
    var names = $http.get('names.json', { cache: false}); 
    return $q.all([datas, names]); 
}; 
}); 

    app.controller('FirstCtrl', function($scope, service) { 
    var promise = service.getNames(); 
    promise.then(function (data) { 
    $scope.names = data.names.data; 
    $scope.datas = data.datas.data; 
}); 

今私は示さなければなりませんそのテーブルのHTMLに:

div ng-controller="FirstCtrl" 
    <table> 
     <tbody> 
      <tr ng-repeat="name in names.concat(datas)"> 
      <td>{{name.name}}</td> 
      <td ng-if="name.down === 'False'">{{name.down}}</td> 
      <td ng-if="name.down !== 'False'">{{name.data}}</td> 
      <td>{{name.data}}</td> 
      </tr> 
     </tbody> 
     </table> 
    </div> 

私は(CONCATを試してみてください)が、それはいけない仕事、NG-繰り返しによって2つのアレイからテーブル件のデータで表示する方法はありますか?事前にお返事ありがとうございます!

答えて

0

私はあなたが望むファイラーを使用して簡単に達成できると信じています。

var app = angular.module('app', []); 
 

 
app.controller('FirstCtrl', FirstCtrl); 
 

 

 
function FirstCtrl($scope) { 
 

 
    $scope.names = [{ 
 
    "name": "AAAAAA", 
 
    "down": "False" 
 

 
    }, { 
 
    "name": "BBBBBB", 
 
    "down": "False" 
 
    }, { 
 
    "name": "CCCCC", 
 
    "down": "True" 
 
    }]; 
 
    $scope.datas = [{ 
 
    "data": "15%" 
 
    }] 
 

 
}; 
 

 
app.filter('getvalue', function() { 
 

 
    return function(name, datas) { 
 

 
    if (name.down === 'False') 
 
     return name.down; 
 
    else 
 
     return datas[0].data; 
 
    } 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="FirstCtrl"> 
 
    <table> 
 
    <tbody> 
 
     <tr ng-repeat="name in names"> 
 
     <td>{{name.name}}</td> 
 
     <td>{{name | getvalue:datas}}</td> 
 
     <td>{{name.data}}</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div>

関連する問題