查询ember-cli应用程序中多次淹没的参数

时间:2015-09-07 11:29:10

标签: ember.js ember-cli query-parameters

我有三个模特

  

国,   城市,商场

路线看起来像

export default Ember.Route.extend({
 model: (params) ->
   Ember.RSVP.hash country: @store.find('country', params);
});

模板看起来像

{{view "select" 
  class="btn btn-default dropdown-toggle"
  content=model.country
  optionLabelPath="content.name"
  optionValuePath="content.id"
  value=selectedCountry
  prompt="Country"
  }}
  {{view "select" 
  class="btn btn-default dropdown-toggle"
  content=currentCities
  optionLabelPath="content.name"
  optionValuePath="content.id"
  value=selectedCity
  prompt=City
  }} 
  {{view "select" 
  class="btn btn-default dropdown-toggle"
  content=currentMalls
  optionLabelPath="content.name"
  optionValuePath="content.id"
  value=value
  prompt=Mall
  }}

城市和购物中心下拉列表分别根据国家和城市选择动态生成

在我的控制器中我有

export default Ember.ObjectController.extend({
 queryParams: ['selectedCountry', 'selectedCity']
 selectedCountry: null,
 seletedCity: null,
 currentCities: null,
 currentMalls: null,

selectedCountryChanged: function() {
  this.set('currentCities', this.store.find('city');    
}.observes('selectedCountry')
selectedCityChanged: function() {
this.set('currentMalls', this.store.find('mall'));    
}.observes('selectedCity')
});

查询参数适用于第一次下拉,但我没有得到第二次下拉的正确值假设我选择国家为美国所谓的资源是

  

RES / V1.0 /国家/ UnitedStates的

当我选择城市时,资源看起来像

  

RES / V1.0 /国家/ UnitedStates的/城市/芝加哥

当我使用这些选定值复制网址时...查询参数

  

= SELECTEDCOUNTRY UnitedStates的&安培; selectedCity =未定义

你能建议我解决上述问题吗?基本上城市也应该在我给它分配查询参数之前加载..但城市加载将取决于国家查询参数

1 个答案:

答案 0 :(得分:0)

我通过改变你的store.find表达式并假设一个简单的api来实现这个目的。

路线:

model: function () {
  return this.store.find('country');
  // call looks like: api/countries
}

控制器:

 selectedCountry: null,
 selectedCity: null, 
 selectedMall: null,

 currentCities: null,
 currentMalls: null,

 getCities: Ember.observer('selectedCountry',function(){
    var params = {country: this.get('selectedCountry')};
    this.set('currentCities', this.store.findQuery('city',params));
        // call looks like: api/cities?country=US
 }),
 getMalls: Ember.observer('selectedCity',function(){
    var params = {country: this.get('selectedCountry'), city: this.get('selectedCity')};
    this.set('currentMalls', this.store.findQuery('mall',params));
        // call looks like: api/malls?country=US&city=LA
 }),

我认为国家列表的api不需要查询参数,而城市或购物中心的依赖列表将使用查询参数。