简单的回答:
您可以将路由器注入到你需要像这样的组件:
import Ember from 'ember';
const { computed: { alias }, observer } = Ember
export default Ember.Component.extend({
routing: Ember.inject.service('-routing'),
params: alias('routing.router.currentState.routerJsState.fullQueryParams')
})
这是一个twiddle与此实现。
较长的答案:
您使用的是注入的路由是私有的,并使用routerJsState.fullQueryParams一样,是不是真正的标准做法。
因为查询参数实际上是某处的某个属性,所以如果您可以使某个服务“某处”更好,那么您可以将该服务注入到组件中,而不是像我们现在这样进行路由。例如,页面和限制可以存在于服务中,并被注入到控制器和组件中,并且是更好的解决方案。
这里是that solution in a twiddle。
相关的代码:
services/task-pager.js
import Ember from 'ember';
export default Ember.Service.extend({
page: 0,
limit: 3,
nextPage: function() {
this.set('page',this.get('page') + 1)
console.log(this.get('page'))
},
previousPage: function() {
this.set('page',this.get('page') - 1)
}
})
// controllers/tasks.js
export default Ember.Controller.extend({
taskPager: Ember.inject.service(),
queryParams:['page', 'limit'],
page: Ember.computed.alias('taskPager.page'),
limit: Ember.computed.alias('taskPager.limit'),
actions: {
nextPage: function() {
this.get('taskPager').nextPage()
},
previousPage: function() {
this.get('taskPager').previousPage()
}
}
})
//components/display-qp.js
export default Ember.Component.extend({
params: Ember.inject.service('task-pager')
})
//templates/components/display-qp.hbs
COMPONENT PARAMS PAGE:{{params.page}}