用angular引入復雜的json文件
我們在寫網頁時是有很多的重復代碼和重復樣式的,我們也不能一口氣敲下來,這樣就成為了體力勞動了。
所以我在遇到這種情況的時候大部分是用angular來獲取json的,而用angular來讓json數據庫中的數據導入到網頁中是讓我們不用重復的書寫重復的代碼。
但是一些子元素較少的還比較好整,但是象下拉列表就比較麻煩了。不止寫json文件比較麻煩,連獲取json都變的復雜啦。
比如說我們在寫一個這樣的json文件時
"recruit":[
{"name":"1","describe":[
{"descr":"2"},
{"descr":"3"},
{"descr":"4"},
{"descr":"5"},
{"descr":"6"}
],
"describe1":[
{"descr":"11"},
{"descr":"22"},
{"descr":"33"},
{"descr":"44"},
{"descr":"55"},
{"descr":"66"}
]}
]
這種的json文件相信大家都看到過,這種json獲取時不像我們獲取哪種單一的json時那麽簡單,我們在獲取的時候要使用【下標】來獲取到我們想要的數據。
app.controller(‘test‘,function($scope,$http){
$http.get(‘../data/data.json‘).success(function(data){
$scope.Data = data.recruit;
$scope.headerNav = $scope.Data[0].name;
$scope.headerNav1 = $scope.Data[1].describe;
$scope.headerNav1 = $scope.Data[2].describe1;
}).error(function(s){
alert(s);
})
})
這樣我們就可以獲取到自己想要的數據,並書寫到頁面中了
用angular引入復雜的json文件