如何从 Ember Octane 中的子组件调用当前路由器中的操作？

Question

我正在使用 Ember Octane 版本，我想从子组件调用 Route 中的操作。伪代码如下。

**Route**
export default class SomeRouter extends Route {    
    model() {
        return data;        
    }
    @action
    refreshRoute() {
        this.refresh();
    }
}

**SomerRouter.hbs** 

<ChildComponent> //Using child component here

**ChildComponent**
export default class ChildComponent extends Component { 
    @action
    revert() {
       //How do I invoke the "refreshRoute" on the SomeRouter from here?
    }
}

在上述子组件的revert方法中，"this"指的是组件本身，但在之前版本的ember中，"this"指的是路由器，我可以简单地调用 this.refresh()。那么我如何在 Ember Octane 中实现这一点。非常感谢任何帮助。

Answer 1

你不知道。这其实也是和octane还是有点不一致的地方之一。因为路由模板的绑定上下文是Controller，而不是路由。所以你不能访问 {{this.refreshRoute}}.

的动作

要在 Route 上调用操作，最好的方法是使用 send。但是要做到这一点，您需要一个控制器并在控制器上定义一个不同的操作：

controllers/some.js:

export default class SomeController extends Controller {
  @action
  refreshRouteFromController() {
    this.send('refreshRoute');
  }
}

现在您可以在模板中使用此功能：

<ChildComponent @refresh={{this.refreshRouteFromController}}>

然后从您的组件中使用它：

revert() {
   this.args.refresh();
}

或直接通过按钮：

<button {{on "click @refresh}}>...</button>

如何从 Ember Octane 中的子组件调用当前路由器中的操作？

How to invoke an action in the current router from the child component in Ember Octane?

ember.js

ember-octane