Select Ember.js：重新加载页面时，选择URL中未保存的状态

在选择国家的页面上有select，需要将所选值保存在URL中。 我在路由驱动控制器中声明了查询参数。 都是工作！如果更改了国家选择，则url也会更改

演示：

但若我用一些有效的GET参数重新加载页面，那个么它的参数将转换为“undefined”。 例如，我尝试加载页面

http://output.jsbin.com/releza#/?country=2

它重定向到

http://output.jsbin.com/releza#/?country=undefined

为什么?

您正在使用setupController将数据馈送到控制器。然后将Countries属性设置为store.find返回的承诺

当页面加载时，Ember不会等待该承诺得到解决。因此，选择框显示时没有条目，查询参数条目被视为不存在，并替换为未定义

要解决此问题，请使用管线的模型挂钩。然后，Ember将等待承诺得到解决，然后再将单词传递给控制器，此时将出现选择框，其中的项目已预加载

演示：

---

请注意，您没有遇到上一个问题中的问题，因为Ember Data在内部将记录ID转换为字符串。

如果我需要两个模型和两个相应的选择，该怎么办。例如，乡村和城市。在这种情况下，我如何表示城市？我在一条路线上找到了两个模型的答案。注意，答案相当复杂。我给你看了一个简单的解决方案，附带加载。哦，我没看到你的答案。这正是我所需要的，非常感谢！

# index.hbl
<script type="text/x-handlebars" id="index">
    {{view "select" content=countries   
                  optionValuePath="content.id" 
                  optionLabelPath="content.name"  
                  value=country
                  prompt="Select a country"}}
</script>

# apps.js
App = Ember.Application.create({});

// ROUTES
App.IndexRoute = Ember.Route.extend({
  setupController: function(controller, model) {
    controller.set('countries', this.store.find('country'));
    }
});

// CONTROLLERS
App.IndexController = Ember.Controller.extend({
    queryParams: ['country'],
    country: null,
});

// MODELS
App.Country = DS.Model.extend({  
    name: DS.attr('string'),
});

$.mockjax({
  url: "/countries",
  dataType: 'json',
  responseText: {
    "country": [
      {"id":1, "name":"Абхазия"},
      {"id":2, "name":"Австралия"},
      {"id":3, "name":"Австрия"},
      {"id":4,"name":"Азейбарджан"},
    ],
  }
});