我们可以从ember js中的组件路由吗?

时间:2014-03-27 09:23:21

标签: ember.js

我有一个组件,其中包含一个带有动作的按钮              {{action'create'}} 在动作中创建我写的像 this.transitionTo('page.new'); 但我得到一个例外,如无法读取属性'输入'未定义可以有人回答吗?只是想知道是否可以从组件路由?

4 个答案:

答案 0 :(得分:7)

这样做的方法是使用组件中的this.sendAction()并将其冒泡到路由器。然后,路由器可以呼叫this.transitionTo()

link-to的方式是注入路由_routing: inject.service('-routing'),

https://github.com/emberjs/ember.js/blob/v2.1.0/packages/ember-routing-views/lib/components/link-to.js#L530

答案 1 :(得分:4)

Ember.Component已从Ember.View延伸,您无法在视图中使用this.transitionTo。它只能通过控制器/路由器完成。

如果您希望在点击时在组件内部进行转换,则可以使用link-to帮助程序,但如果您仍希望能够处理该操作,请阅读:http://emberjs.com/guides/components/handling-user-interaction-with-actions/及其后的指南。

答案 2 :(得分:4)

我发现答案是可能的。我们可以使用我们的组件操作中的以下代码

App.Router.router.transitionTo('new route');

我们将收到一个回调,我们可以在其中设置新路径的模型。使用以下代码。

App.Router.router.transitionTo('your route here').then(function(newRoute){

    newRoute.currentModel.set('property','value');

});

答案 3 :(得分:0)

注射是你想做的最后一件事。您在路由和组件之间传递操作的方式是使用sendAction方法Send Action

<强> template.hbs

{{your-component  action="nameOfYourRouteAction" }}

<强> route.js

export default Ember.Route.extend({


ratesService: Ember.inject.service(),
  model() {
    //return yourdata
  },


  actions: {
    nameOfYourRouteAction(...args){
        this.transitionTo(...args);
    }
  }
});
你的component.js

中的

import Ember from 'ember';

export default Ember.Component.extend({

    actions: {
        toggleTransition: function(...args) {
            this.sendAction('action', ...args);
        }
    }
});

<强> component.hbs

<button {{action "toggleTransition" 'your route'}}>Change Route</button>