如何從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發表評論？

回答

相關問題