I have an index of all flights that is displayed at http://localhost:4200/flights
How can I create a Kayak like experience where the URL http://localhost:4200/flights/FRA-JFK would display only the flights from FRA to JFK?
The setup:
ember new travel_app
ember g http-mock flight
ember g adapter application
ember g resource flights
app/models/flight.js
import DS from 'ember-data';
export default DS.Model.extend({
from: DS.attr('string'),
to: DS.attr('string'),
code: DS.attr('string')
});
app/routes/flights.js
import Ember from 'ember';
export default Ember.Route.extend({
model: function() {
return this.store.find('flight');
}
});
app/templates/flights.hbs
List of flights:
<ul>
{{#each flight in model}}
<li>{{flight.code}} {{flight.from}} - {{flight.to}}</li>
{{/each}}
</ul>
server/mocks/flights.js
module.exports = function(app) {
var express = require('express');
var flightsRouter = express.Router();
var items = [
{
id: 1,
from: "FRA",
to: "JFK",
code: "LH 400"
},
{
id: 2,
from: "JFK",
to: "FRA",
code: "LH 401"
}
];
flightsRouter.get('/', function(req, res) {
res.send({
'flights': items
});
});
[...]
app/adapters/application.js
import DS from 'ember-data';
export default DS.RESTAdapter.extend({
'namespace': 'api'
});
Aucun commentaire:
Enregistrer un commentaire