我是JSON的初学者。
我想在我的html <div>
中显示我的所有JSON数据,但我不知道如何使用EXPRESSJS对象。
查找我的JSON数据
app.post("/form",function(req,res)
{
var departure=req.body.departure;
var destination=req.body.destination;
response = {
"flights": [{
"departure": departure,
"destination": destination,
"time": {
departure: 10,
destination: 12
},
"price": 2000
}, {
"departure": departure,
"destination": destination,
"time": {
departure: 12,
destination: 14
},
"price": 4000
}, {
"departure": departure,
"destination": destination,
"time": {
departure: 14,
destination: 16
},
"price": 8000
}]
};
res.json({departure: departure, destination: destination});
});
我的HTML
<div ng-repeat="item in response">
<dir>{{item.departure}}</dir>
<dir>{{item.destination}}</dir>
<dir>{{item.time.departure}}</dir>
<dir>{{item.time.destination}}</dir>
<dir>{{item.price}}</dir>
</div>
AngularJS代码
app.controller('formController', function($scope, $http) {
$scope.pageClass = 'form';
$scope.departure = '';
$scope.destination = '';
$scope.submit = function() {
$http.post('/form', {
departure: $scope.departure,
destination: $scope.destination
}).then(function(res) {
$scope.response = res.data;
});
}
});
目前我正在询问我的出发地和目的地。有没有办法通过编写我的res.json()而不用变量变量来显示我的所有数据?我想我也必须用ng-repeat做一些事情?
先谢谢你
答案 0 :(得分:1)
是的,您需要使用ng-repeat
var app = angular.module('app',[]);
app.controller('myController',function($scope){
$scope.response = {
"flights": [{
"departure": "departure1",
"destination": "destination1",
"time": {
departure: 10,
destination: 12
},
"price": 2000
}, {
"departure": "departure2",
"destination": "destination2",
"time": {
departure: 12,
destination: 14
},
"price": 4000
}, {
"departure": "departure3",
"destination": "destination3",
"time": {
departure: 14,
destination: 16
},
"price": 8000
}]
};
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
<div ng-controller="myController">
<div ng-repeat="item in response.flights">
<dir>{{item.departure}}</dir>
<dir>{{item.destination}}</dir>
<dir>{{iteme.time.departure}}</dir>
<dir>{{item.time.destination}}</dir>
<dir>{{item.price}}</dir>
</div>
</div>
</div>
&#13;
答案 1 :(得分:0)
您需要使用ng-repeat
<div ng-repeat="flight in response.flights">
<dir>{{flight.departure}}</dir>
<dir>{{flight.destination}}</dir>
<dir>{{flight.time.departure}}</dir>
<dir>{{flight.time.destination}}</dir>
<dir>{{flight.price}}</dir>
</div>
上找到任何Angular的好参考