Ember js链接到动态查询参数答案

【问题标题】：Ember js link-to dynamic query paramEmber js链接到动态查询参数
【发布时间】：2016-02-11 19:50:59
【问题描述】：

我会举例说明

{{#link-to item.targetUrl (query-params randomParam=value.id) class="link-wrap"}}abc{{/link-to}}

如果 targeturl 是 abc.xyz 这会给我 href="#/abc/xyz?randomParam=2"

如何拥有动态参数？？？ randomParam 不会相同，它可能是 randomParm1 或 randamParm2 所以我想要如下所示：

{{#each selectedTab.content as |item|}}

      {{#each item.values as |value|}}
      <li {{action 'itemSelect' item.targetUrl item.param }}>{{#link-to item.targetUrl (query-params item.param=value.id) class="link-wrap"}}{{value.desc}}{{/link-to}}</li>
      {{/each}}

  {{/each}}

这里的 item.param 是动态的。我并不是真的在寻找解决方法，因为我从模板中的操作中找到了使用 this.transitionTo 的解决方案。我正在寻找如何在 {{link-to}} 助手中解决这个问题。

【问题讨论】：

标签： javascript ember.js link-to query-parameters

【解决方案1】：

您可以将参数作为哈希而不是位置参数传入（这是您现在正在做的）。

所以你会做这样的事情：

// template.hbs
{{#link-to params=myParams}}
    Some text
{{/link-to}}


// component.js
{
    myParams: ['your.route.string']
}

现在，如果您有更复杂的带有动态段或查询参数的路线：

动态细分

如果您有一个动态网段，您的路由器可能如下所示：

// router.js
this.route('users', function(){
    this.route('user', {path: '/:username'})
});

然后你会做这样的事情：

// template.hbs
{{#link-to params=myParams}}
    Some text
{{/link-to}}


// component.js
{
    myParams: ['users.user', 'SOME_USERNAME']
}

查询 {arams

如果你有查询参数并且你的控制器看起来像：

// controller.js
{
    queryParams: ['foo', 'bar']
}

然后你会做这样的事情：

// template.hbs
{{#link-to params=myParams}}
    Some text
{{/link-to}}


// component.js
{
    myParams: ['some.route.string, {
        isQueryParams: true,
        values: {
            foo: 'some_value',
            bar: 'another_value',
        }   
    }]
}

请注意，查询参数对象必须位于数组的最后。因此，如果您也有一个动态细分，它看起来像

myParams: ['some.route.string', 'someDynamicID', {queryObject}]

【讨论】：