[英]Can we route from a component in ember js?
I have a component which has a button with an action like {{action 'create'}} and inside the action create i wrote like this.transitionTo('page.new'); 我有一个组件,其中有一个按钮,其动作类似{{ action'create '}},并且在动作中创建我写的像this.transitionTo('page.new'); But i am getting an exception like Cannot read property 'enter' of undefined can anyone answer please?Just want to know is that possible to route from a component?
但我得到一个例外,如无法读取未定义的属性'enter'可以有人回答吗?只是想知道是否有可能从组件路由?
The way to do that is to use this.sendAction()
from your component and bubble it up to the router. 这样做的方法是使用组件中的
this.sendAction()
并将其冒泡到路由器。 The router can then call this.transitionTo()
. 然后路由器可以调用
this.transitionTo()
。
The way link-to
does it is by injecting routing _routing: inject.service('-routing'),
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 https://github.com/emberjs/ember.js/blob/v2.1.0/packages/ember-routing-views/lib/components/link-to.js#L530
Ember.Component
is extended from Ember.View
and you cant use this.transitionTo
in a view. Ember.Component
是从Ember.View
扩展而你无法在视图中使用this.transitionTo
。 It can be done only through a controller/router. 它只能通过控制器/路由器完成。
If you want a transition inside the component on clicking, you could use the link-to
helper, but if you still want to be able to handle that action, read: http://emberjs.com/guides/components/handling-user-interaction-with-actions/ and the guide after it. 如果您希望在单击时在组件内部进行转换,则可以使用
link-to
帮助程序,但如果您仍希望能够处理该操作,请阅读: http : //emberjs.com/guides/components/handling-user -interaction-with-actions /以及之后的指南。
I found out the answer it is possible.we can use simply use the following code from our components action 我发现答案是可能的。我们可以使用我们的组件操作中的以下代码
App.Router.router.transitionTo('new route');
and we will get a call back for this,in which we can set the new route's model.Use the following code for that. 我们将收到一个回调,我们可以在其中设置新路由的模型。使用以下代码。
App.Router.router.transitionTo('your route here').then(function(newRoute){
newRoute.currentModel.set('property','value');
});
Injection is the last thing you wanna do. 注射是你想做的最后一件事。 The way you communicate actions between routes and components is to use the sendAction Method Send Action
在路由和组件之间传递操作的方式是使用sendAction方法发送操作
template.hbs template.hbs
{{your-component action="nameOfYourRouteAction" }}
route.js route.js
export default Ember.Route.extend({
ratesService: Ember.inject.service(),
model() {
//return yourdata
},
actions: {
nameOfYourRouteAction(...args){
this.transitionTo(...args);
}
}
});
in your component.js 在你的component.js中
import Ember from 'ember';
export default Ember.Component.extend({
actions: {
toggleTransition: function(...args) {
this.sendAction('action', ...args);
}
}
});
component.hbs component.hbs
<button {{action "toggleTransition" 'your route'}}>Change Route</button>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.