Ember 2 - 过渡到通过组件路由

Ember 2 - Transition to route through component

我正在尝试为 ember 2 应用制作一个分页组件。 由于它是一个通用的分页组件,我想在许多不同的路径上使用它。因此,我需要以某种方式(在我看来)提供我的分页链接工作路径的名称。

我可以轻松地将路由名称(字符串)传递给组件: {{pagination-component myRoute='myCurrentRouteName'}}。和 组件内部:{{link-to myRoute (query-params page=1)}}

它适用于转到以下页面:<< First, < Previous, Next > , Last >>。

但我还希望有一个 select 框,其中包含指向所有页面的选项,如果用户 select 是一个页面,我可以使用类似于此的 queryParams 转换到该路由:myRoute?page=selectedPage。 ember 的所有教程都说在组件内转换是不行的。

但是,如果我希望我的分页是通用的,并且我不想在处理分页并提供完全相同的过渡的每条路线中都采取行动,我该怎么做呢?

到目前为止,我发现我可以将 注入到组件中,这可以在组件内进行转换,但由于某种原因它也不能正常工作。另外,人们说它是私人的且不可靠的。 我还尝试制作一个带有动作的路由混合器,这样我就可以简单地从组件中使用 selectedPage sendAction,但我不知道如何获取路由器(以便调用 router.transitionTo ) 在我的 Mixin 中。

我们应该使用 public API 进行转换,这是在路线 transitionTo and in Controller transitionToRoute 中提供的。这是推荐的方法。

  1. 如您所说,您可以使用 Ember.getOwner(this).lookup('router:main').transitionTo('myRouteName') 使其在组件中工作,但这强烈反对 好的设计。
  2. 您可以在 Application 路由的 actions 散列中定义名为 myTransitionToUrl 的方法,并安装 ember-route-action-helper 插件以调用路由操作方法 myTransitionToUrl组件。
  3. 如果你不想在应用路由中定义方法,那么你可以在mixin中定义它并在需要的路由中实现它。那也行。
  4. 我的选择和推荐的方法 会是,说 pagination-componentprevnexttranstionTo 动作,那么我也会在 Mixin and extend it in all route which uses pagination-component. and will inform any data changes to route through actions from component. that will ensure Data Down Actions Up 策略中实施所有这些动作。

  5. 如果您只是转换到不同的路线,那么最新的可能方式是,

如果ember版本大于2.15,那么可以注入RouterService,直接调用transitionTo方法。 如果你使用的是ember版本2.15或以下,那么你可以使用router service polyfill来使用RouterService。

import Ember from 'ember';

export default Ember.Component.extend({
  router: Ember.inject.service(),

  actions: {
    next() {
      this.get('router').transitionTo('other.route');
    }
  }
});