0

我已经阅读了很多关于 Ember.Selects 的其他 SO 问题，但没有足够的东西可以工作。我有下拉列表来过滤返回数据中的某些字段。实际的过滤是另一个问题，我现在只是想填充下拉菜单。

根据文档，我的工作是在我的控制器上声明的静态数组，但我真正想要的是用数据中的唯一值填充下拉列表，这样我就不必维护选项数组。

我认为我需要的只是将选择的content属性设置为模型中的一个字段，但只是放置content=field或contentBinding=field不起作用。

对此的任何建议或最佳实践将不胜感激。

4

2 回答 2

2

这是一个工作代码片段：

App = Em.Application.create({
  displayName: 'Some.App'
});


App.Person = DS.Model.extend({
  name: DS.attr('string')
});

// this is testing data that should come from your backend api
App.Person.FIXTURES = [
  {id: 1, name: 'John Oliver' },
  {id: 2, name: 'Jon Stewart' },
  {id: 3, name: 'Cenk Uygur' }
];

// in real life, you'll be using another type of adapter, likely DS.RESTAdapter
App.ApplicationAdapter = DS.FixtureAdapter.extend();

App.IndexRoute = Em.Route.extend({
  model: function(params) { 
     return this.store.find('person');
  } 
});
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Le Select" />
  <meta charset="utf-8">
  <title>Ember Starter Kit</title>
  <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
  <script src="http://builds.emberjs.com/tags/v1.7.0/ember.js"></script>
  <script src="http://builds.emberjs.com/beta/ember-data.js"></script>
</head>
<body>
  
  <script type="text/x-handlebars">
    <h1>{{unbound App.displayName}}</h1>
    <hr />
    {{outlet}} 
  </script>
  
  <script type="text/x-handlebars" data-template-name="index">
    <h3>Index</h3> 
    Le Person: {{view Ember.Select prompt='- Select -' content=controller.model optionValuePath='content.id' optionLabelPath="content.name"}}
  </script>

</body>
</html>

于 2014-10-17T13:53:15.367 回答
1

content的选择视图想要是一个字符串数组，或者一个对象数组。

如果您希望能够控制将哪些属性用作选择和值，则对象数组效果最好。

{{view Ember.Select
        prompt="Select Something"
        content=modelProperty
        optionLabelPath="content.labelProperty"
        optionValuePath="content.valueProperty"
        value=boundValue
  }}

这是一个工作示例

于 2014-10-17T13:41:18.867 回答