构建Ember Power-Select组件

时间:2016-03-18 03:41:30

标签: ember.js

想知道是否可以按如下方式使用Ember power-select。

我有一个有相关记录的模型。我尝试使用PS从其中一个列表中选择以设置另一个相关记录。为了更全面地解释,这是最终的结束状态。 (这是一场歌唱比赛,模型大写):

  • 每位参赛者唱多首歌
  • 每首歌都有一张图表
  • 每位参赛者提交多份提交(提前)以进行预先审批
  • 每个提交都有一个图表

我试图使用电源选择从每个参赛者特定的预先清除的提交列表中选择每首歌曲的图表。

我可以让部分内容有效,但不能将整个事情放在一起,因为(我认为)我试图排列提交和图表,这些是相关但不同的项目。

所以,在代表参赛者模特的网页上,我试图这样做:

{{power-select options=model.submissions onchange=(action pseudo-code: save selected submission.chart to model.chart.)}}

我知道这对格式来说是个难题,但是我已经无可救药地被困了

更新:我仍然认为我错过了什么。以下是显示所有模型及其关系的模式。 schema

在这种情况下,主要的页面是' (即'模型')是Performance。每个表演都有多首歌曲(准确地说是两首),出于用户界面的目的,我更喜欢同时显示。所以我在此上下文中使用{{#each model.songs as |song|}}来选择chart。每个song都有一个父chart。作为进一步的复杂性,给定song的图表不一定必须出现在submission表中;但在大多数情况下,图表列表将受到限制。

所以我最终要做的是根据通过chart表提交的内容(具体来说是一个很多对象)提供submission个对象的过滤列表。最终,我希望在chart模型上保存song字段,这意味着performance页面上有两个电源选择组件。

我知道,非常复杂的问题。但幸运的是,我已经准确地传达了这个问题......谢谢

1 个答案:

答案 0 :(得分:5)

如果我明白了,你只想在用户选择一个选项时设置belongsTo关系。

{{#power-select 
  options=model.submissions
  selected=model.chart
  onchange=(action (mut model.chart) value="chart") as |submission|}}

  {{submission.name}}

{{/power-select}}

选择提交后,只需拨打model.set('chart', submission.chart)

即可