如何从json发表评论？

我希望屏幕显示保留列表。完整列表位于.json文件中。预订通过输入缩短的机场名称来选择。问题是我们显示条目的名称，但我们没有显示完整的机场名称？如何从json发表评论？

我reservations.html

<h3>Reserve for flight</h3> 

<div class="controls controls-row"> 
    <input type="text" class="input-small" placeholder="Origin" ng-model="reserve.origin"> 
    <input type="text" class="input-small" placeholder="Destination" ng-model="reserve.destination"> 
</div> 

<a href="" class="btn btn-primary" ng-click="reserveFlight()">Reserve</a> 

<h3>Your Reservations</h3> 

<table ng-show="reservations.length" class="table"> 
    <thead> 
    <tr> 
     <th>Number</th> 
     <th>Origin</th> 
     <th>Destination</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr ng-repeat="flight in reservations"> 
     <td>{{flight.number}}</td> 
     <td> 
     <a ng-href="#/airports/{{flight.origin}}"> 
      {{flight.origin + ' - ' + flight.originFullName}} 
     </a> 
     </td> 
     <td> 
     <a ng-href="#/airports/{{flight.destination}}"> 
      {{flight.destination + ' - ' + flight.destinationFullName}} 
     </a> 
     </td> 
    </tr> 
    </tbody> 
</table> 

<div ng-hide="reservations.length" class="alert alert-info"> 
    You don't currently have any reservations, why not make one now? 
</div>

我app.js

'use strict' 

angular.module('airline', ['ngRoute']) 

    .config(['$routeProvider', function($routeProvider){ 
$routeProvider 
    .when('/', { 
     templateUrl: 'partials/destinations.html', 
     controller: 'destinationsCtrl' 
    }) 
    .when('/airports/:airportCode', { 
     templateUrl: 'partials/airport.html', 
     controller: 'airportCtrl' 
    }) 
    .when('/flights', { 
     templateUrl: 'partials/flights.html', 
     controller: 'flightsCtrl' 
    }) 
    .when('/reservations', { 
     templateUrl: 'partials/reservations.html', 
     controller: 'reservationsCtrl' 
    }) 
}]) 

.controller('AppCtrl', function($scope){ 

    $scope.airportTemplate = 'partials/airport.html'; 

    $scope.setActive = function (type){ 
    $scope.destinationsActive = ''; 
    $scope.flightsActive = ''; 
    $scope.reservationsActive = ''; 

    $scope[type + 'Active'] = 'active'; 
    } 
}) 

.controller('destinationsCtrl', ['$scope', '$http', function($scope, $http){ 
    $scope.setActive('destinations'); 

    $scope.sidebarURL = 'partials/airport.html' 
    $scope.formURL = 'partials/form.html' 

    $scope.currentAirport = null; 

    $scope.setAirport = function(code){ 
    $scope.currentAirport = $scope.airports[code]; 
    }; 

    $scope.editAirport = function(code){ 
    $scope.editing = $scope.airports[code]; 
    }; 

    $http.get('data/airports.json').then(function(response){ 
    $scope.airports = response.data; 
    }); 

}]) 

.controller('flightsCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http){ 
    $http.get('data/flights.json').then(function(response){ 
    $scope.flights = response.data; 
}); 
    $scope.setActive('flights'); 
    $scope.airports = {}; 
}]) 

.controller('airportCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http){ 
    $http.get('data/airports.json').then(function(response){ 
    $scope.airports = response.data; 
    $scope.currentAirport = $scope.airports[$routeParams.airportCode]; 
    }); 
}]) 

.controller('reservationsCtrl', ['$scope', '$routeParams', '$http', function($scope, $routeParams, $http){ 
    $http.get('data/flights.json').then(function(response){ 
    $scope.reservations = response.data; 
    $scope.reservations = []; 
    $scope.reserve = {origin: "", destination: ""}; 

    $scope.reserveFlight = function(){ 
     console.log($scope.reserve); 
     $scope.reservations.push($scope.reserve); 

    } 
    }); 

    $scope.setActive('reservations'); 

}])

flights.json文件

{ 
    "number": 112, 
    "origin": "ATL", 
    "destination": "LAX", 
    "price": 232, 
    "originFullName": "Hartsfield Jackson Atlanta International Airport", 
    "destinationFullName": "Los Angeles International Airport" 
}, 
{ 
    "number": 812, 
    "origin": "ATL", 
    "destination": "JFK", 
    "price": 192, 
    "originFullName": "Hartsfield Jackson Atlanta International Airport", 
    "destinationFullName": "John F. Kennedy International Airport" 
}, ...

这是我们现在显示

，它应该是这样的

来源

2016-06-12 sanja

为了记录，我真的很困惑标题。这完全和完全没有关系。 –

当你的JSON，重写空数组中的数据，失去了一切：

$http.get('data/flights.json').then(function(response){ 
    $scope.reservations = response.data; 
    $scope.reservations = [];

我不知道你为什么这样做，但自然会导致你在阵列中没有任何东西。它将是空的。

所以你只会看到你通过点击按钮添加的保留。但是，您在要添加的对象中没有“originFullName”和“destinationFullName”，只有短名称。

由于基本逻辑错误，我无法修复您的代码。您可以为全名添加另外两个文本框，或者不清除该数组，并且您会看到现有数据。（但在添加新项目时仍然看到部分内容。）

来源

2016-06-12 08:57:26

如何从json发表评论？

回答

相关问题