傳入任意json數據源進行格式化處理並用Angularjs顯示

在項目開發中，有些時候咱們並不知道傳入的數據源(只針對於json格式的)的內部結構，本文用最笨的辦法先把數據源格式化一遍，把全部的key值替換成自定義的值，而後在頁面上用angularjs展現。

html代碼：

<div class="col-xs-12 col-sm-12 col-md-4 col-lg-3 col-hj-div" ng-app='hjhhhap' ng-controller='fgfg_con' id="jkjk">
　　<table class="table hj-select-pannel-table table-striped table-hover">
　　　　<tbody>
　　　　　　<tr ng-repeat="hj_test3_data in ghghgh track by $index">
　　　　　　　　<td><input type="checkbox"></td>
　　　　　　　　<td>{{hj_test3_data.hj_index_1}}</td>
　　　　　　　　<td>{{hj_test3_data.hj_index_2}}</td>
　　　　　　</tr>
　　　　</tbody>
　　</table>
</div>

js代碼：

<script>

　　

var demoApp = angular.module("hjhhhap",[]);
demoApp.controller("fgfg_con",['$scope',function($scope){
//console.log(JSON.stringify(ghghgh_result));
var ghghgh_result=hjFormatDataSource(this_company1);
var ghghgh_result1=[{"hj_index_1":"1007","hj_index_2":"邯鄲漢迪","hj_index_3":"111111"},{"hj_index_1":"1008","hj_index_2":"邯鄲樂尚","hj_index_3":"111111"}];

//測試數據源
$scope.ghghgh=ghghgh_result;
}]);

//若是頁面上已經使用過ng-app了，這裏就得添加這段代碼，啓動該ng-app
angular.element(document).ready(function (){angular.bootstrap(document.getElementById('jkjk'), ['hjhhhap']);});

 

//數據處理階段

function hjFormatDataSource(this_dataSource){
　　var hj_data_source=[];

　　//遍歷該數據源
　　for(var i=0; i<this_dataSource.length; i++){
　　　　var myjsonStr = "";
　　　　var this_list={};
　　　　var j=1;
　　　　for(var key in this_dataSource[i]){

　　　　　　//把數據源的key變成自定義的屬性，方便頁面上顯示
　　　　　　myjsonStr = setJson(myjsonStr,"hj_index_"+j,this_dataSource[i][key]);
　　　　　　j++;
　　　　}
　　　　hj_data_source.push(myjsonStr);
　　}
　　var arr = eval('([' + hj_data_source + '])');
　　return arr;
}

//添加或者修改json數據
function setJson(jsonStr,name,value)
{
　　if(!jsonStr)jsonStr="{}";
　　var jsonObj = JSON.parse(jsonStr);
　　jsonObj[name] = value;
　　　　return JSON.stringify(jsonObj);
}

function strToJson(str){
　　var json = eval('(' + str + ')');
　　return json;
}

</script>

 

若有不足之處，請多多指教。