从组件刷新/重新加载 ember 路由答案

【问题标题】：Refresh / Reload ember route from a component从组件刷新/重新加载 ember 路由
【发布时间】：2017-10-24 00:17:45
【问题描述】：

我有一个组件，它实际上是一个模态对话框。当我完成该对话框并按下“确定”按钮时，我想留在我打开该对话框的停留页面上。这并不难。

但问题是对话框更改了数据（我通过 REST 调用获取数据），因此我需要刷新我已经在的路由以反映数据更改。

由于我是从组件调用它，我没有Route，所以不能调用route.refresh()。

我尝试获取路由器：

this.set('router', Ember.getOwner(this).lookup('router:main'));

并确实转换到同一页面：

_this.get('router').transitionTo('my-route')

但是由于路由没有改变（我只打开了一个对话框），transitionTo 没有被触发！

有没有办法强制触发transitionTo 或刷新我所在的页面？

谢谢！

【问题讨论】：

标签： javascript ember.js routes components router

【解决方案1】：

首先，您可以通过将routing service 注入组件来轻松获取当前路由名称。
然后，您可以获取当前路由实例并应用其refresh 方法：

// app/components/a-component.js

import Component from "ember-component";
import service from "ember-service/inject";
import getOwner from "ember-owner/get";

export default Component.extend({
  routing: service("-routing"),
  actions: {
    refresh() {
      const currentRouteName = this.get("routing.currentRouteName");
      const currentRouteInstance = getOwner(this).lookup(`route:${currentRouteName}`);
      currentRouteInstance.refresh();
    }
  }
});

【讨论】：

getOwner 查找不是给你Router 而不是Route？因为refresh 方法属于Route 而不是Router。
路由器是通过routing.router 给出的。查找正在查找路由实例，这是因为查找的模块名称的 route: 前缀。 refresh 方法确实是 Route 方法。 currentRouteInstance.refresh(); 正在应用 Route 实例的刷新方法。我的解决方案与@kumkanillam 的不同之处在于它不需要您采取任何行动。
currentRouteInstance 未定义，并在调用 refresh 时引发异常。 currentRouteName 计算得很好。
currentRouteName 是什么？
@EmberFreak RouterService 现在是最新版本的 Ember 中的公共 API，因此可以认为它可以安全使用（现在注入时不带破折号前缀，只需 router: service() 工作）。仅供 2019 年找到此答案的任何人参考。api.emberjs.com/ember/3.10/classes/RouterService

【解决方案2】：

为此，在最近路由或应用程序路由文件中定义refreshCurrentRoute方法。

actions:{
 refreshCurrentRoute(){
  this.refresh();
 }
}

从您的组件中，您需要调用refreshCurrentRoute 操作。您可以使用ember-route-action-helper 或通过关闭操作。

【讨论】：

谢谢@kumkanillam！