构建 Ember Power-Select 组件

Question

想知道Ember power-select是否可以如下使用

我有一个模型有相关记录。我正在尝试使用 PS 从该列表中选择一个以设置另一个相关记录。为了更全面地解释，这里是最终的结束状态。（这是为了歌唱比赛，模型大写）：

每位参赛者演唱多首歌曲
每首歌有一张谱面
每位参赛者为 pre-clearance
每个提交都有一个图表

我正在尝试使用 power-select 从每个参赛者特定的 pre-cleared 提交列表中为每首歌曲选择图表。

我可以让部分内容正常工作，但无法将全部内容整合在一起，因为（我认为）我正在尝试排列提交和图表，它们是相关但不同的项目。

所以，在代表参赛者模型的页面上，我正在尝试做：

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

我知道这对格式来说是个难题，但我无可救药地卡住了

更新：我仍然觉得我遗漏了什么。这是显示所有模型及其关系的模式。

在此上下文中，主要'page'（即'model'）是Performance。每场演出都有多首歌曲（准确地说是两首），出于 UI 的目的，我希望同时展示这些歌曲。所以我在这个上下文中使用 {{#each model.songs as |song|}} 来选择 chart。每个 song 有一个 parent chart。更复杂的是，给定 song 的图表不一定必须出现在 submission table 上；但在大多数情况下，这就是图表列表的限制方式。

所以最终我想要做的是根据通过 submission table 提交的内容筛选 chart objects（这本质上是一个 many-to-many 通过。最终我希望在 song 模型上保存 chart 字段，所以这意味着 [=24] 上有两个 power-select 组件=] 页。

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

Answer 1

如果我明白了，你只想在用户选择一个选项时设置一个 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)

构建 Ember Power-Select 组件

Build Ember Power-Select component

ember.js

ember-power-select