链接到ember中的查询参数

Question

我正在尝试将一些查询参数作为组件参数传递，然后在link-to上使用它。

{{activities/list-item
  model=submission
  task=model
  parent=parent
  group=model.group
  activitiesShowRoute=(concat "assignments.show.tasks.discuss.show." (pluralize submission.type) ".show")
  queryParams=(query-params allocation_id="all")
}}

然后我像这样使用它：

{{#link-to activitiesShowRoute group parent task model queryParams}}Click{{/link-to}}

它按预期方式工作，问题是，如果我在queryParams中调用没有值的组件，则生成的链接将具有href='#'，而不是没有查询参数的所需路由。

我不想在链接之外有一个{{#if queryParams}}，因为实际上我的链接内容非常复杂，我不想重复所有内容。

我能否使其表现出想要的表现？谢谢

Answer 1

添加永久未使用的查询参数

queryParams=(query-params foo="bar")

Answer 2

<LinkTo>的现代尖括号版本支持带有查询参数的哈希：

<LinkTo @route="posts" @query={{hash direction="asc"}}>Sort</LinkTo>

这不仅是将来的证明，也是当前推荐的方法，而且由于您不再需要使用{{query-params}}帮助器，因此还可以减少特定情况下的复杂性。

应用于您的代码后，它看起来像这样：

{{activities/list-item
  model=submission
  task=model
  parent=parent
  group=model.group
  activitiesShowRoute=(concat "assignments.show.tasks.discuss.show." (pluralize submission.type) ".show")
  queryParams=(hash allocation_id="all")
}}
<LinkTo
  @route={{@activitiesShowRoute}}
  @models={{@array @group @parent @task @model}}
  @queryParams={{@queryParams}}
>
  Click
</LinkTo>
如果您更改{{activities/list-item}}（或尖括号语法中的<Activities::ListItem>的公共API以直接接受@route，@models和@queryParams参数，则可以进一步简化API。

内置组件的尖括号版本自Ember 3.10起可用。有关详情，请参见release notes。它们是Ember Octane edition的一部分。