Question

我是Ember.js的新手，我正在构建一个使用Ember.js和Ember-Data作为其前端技术的Web应用程序。我试图了解当您在使用独立模型的页面上有多个ember-data绑定组件时最佳实践。

以下是我正在尝试做的事情：

https://gist.github.com/redrobot5050/6e775f4c5be221cd3c42

（页面上有一个链接，可以在jsbin这个要点中编辑它。出于某种原因，我无法从虚荣URL中获得“共享”URL。）

我有一个这样的模板：

 <script type="text/x-handlebars" data-template-name="index">
  <p>Options for graphics quality: </p>
    <ul>
    {{#each item in model}}
      <li>{{item.setting}}</li>
    {{/each}}
    </ul>
    <p>Currently Selected: {{model.selectedValue}}</p>
    <p>Draw Distance Options:</p>
    <ul>
    {{#each item in dropdown}}
      <li>{{item.distance}}
    {{/each}}
    </ul>
    <p>Currently Selected Distance: {{selectedDistance}}
</p>
{{outlet}}
    <button {{action 'openModal' 'modal' model}}>Change Settings</button>
  </script>

在此模板中，所有数据都正确绑定并显示在范围内。但是，当我尝试在其模式对话框中修改它时，只有Quality绑定到其Ember.Select视图。我试图使用controller.set强制在IndexController中绑定，但它似乎没有工作。

我的IndexController看起来像这样：

App.IndexRoute = Ember.Route.extend({
  model: function() {
    var qualityList = this.store.find('quality');
    console.log('qualityList=' + qualityList);    
    return qualityList;
    //return App.Quality.FIXTURES;
  },
  setupController : function(controller, model) {
    controller.set('model', model);
    var drawDistanceList = this.store.find('drawDistance');
    console.log('distanceList=' + drawDistanceList );
    controller.set('dropdown', drawDistanceList);
    controller.set('selectedDistance', 1);
    //this.controllerFor('modal').set('dropdown', drawDistanceList );
  }
});

JSBin真正展示了我正在尝试做的事情：我想从同一个控制器独立加载/绑定每个下拉列表。 JSBin无法正常工作，因为我还不确定如何做到这一点。我发布到stackExchange，看看是否有人可以修改这个JSBin并告诉我我做错了什么，或者是否有人可以指出我正确的方向，设计明智如何解决这个问题？

（例如，我认为一个可能的解决方案可能是将下拉列表创建为组件，并通过其控制器加载数据或将其作为属性从父控制器传递，但我真的想知道什么是“ Ember Way“）。

Answer 1

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return Ember.RSVP.hash({
      qualityList: this.store.find('quality'),
      drawDistanceList: this.store.find('drawDistance')
    });
  },
  setupController: function(controller, model) {
    controller.set('model', model.qualityList);
    controller.set('dropdown', model.drawDistanceList);
  }
});

Ember.RSVP.hash的文档曾经在这里：http://emberjs.com/api/classes/Ember.RSVP.html#method_hash。我不确定它为什么会消失。

目前，您可以在http://web.archive.org/web/20140718075313/http://emberjs.com/api/classes/Ember.RSVP.html#method_hash

找到它

Ember.js模态对话框的多个模型

1 个答案: