Question

我有一个显示航班信息的应用程序。所有航班列表均可通过http://localhost:4200/flights获取，以及所有从法兰克福出发的航班列表http://localhost:4200/flights?from=FRA

在显示的列表下方是两个链接，供用户在视图之间切换。不幸的是，一旦用户点击http://localhost:4200/flights?from=FRA链接，他/她就无法通过点击相应的链接返回http://localhost:4200/flights。 from=FRA参数是粘性的。

如何链接到http://localhost:4200/flights页面并删除from=FRA参数？

我使用的代码：

应用/模板/ flights.hbs

<ul>
{{#each flight in filteredFlights}}
  <li>{{flight.code}} {{flight.from}} - {{flight.to}}</li>
{{/each}}
</ul>

<ul>
  <li>{{#link-to 'flights'}}All flights{{/link-to}}</li>
  <li>{{#link-to 'flights' (query-params from="FRA")}}Flights from Frankfurt{{/link-to}}</li>
</ul>

应用/控制器/ flights.js

import Ember from 'ember';

export default Ember.Controller.extend({
  queryParams: ['from','to'],
  from: null,
  to: null,

  filteredFromFlights: function() {
    var from = this.get('from');
    var flights = this.get('model');

    if (from) {
      return flights.filterBy('from', from);
    } else {
      return flights;
    }
  }.property('from', 'model'),

  filteredFlights: function() {
    var to = this.get('to');
    var flights = this.get('filteredFromFlights');

    if (to) {
      return flights.filterBy('to', to);
    } else {
      return flights;
    }
  }.property('from', 'to', 'model')
});

应用/路由/ flights.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
    return this.store.find('flight');
  }
});

Answer 1

只需传递'null'：

{{#link-to 'flights' (query-params from='null')}}All flights{{/link-to}}

删除粘性参数

1 个答案: