EmberJS - 将查询参数从控制器传递到嵌套路由

Question

我目前有一个包含多个输入的表单。这些输入用于填充查询参数。在此路由的控制器上，提交操作注册查询参数输入并使用 transitionToRoute 加载嵌套路由，显示查询 returns.

的信息

这里是控制器的相关部分：

import Controller from '@ember/controller';

export default Controller.extend({

  queryParams: ['dateFrom', 'dateTo', 'unitNumber', 'customerName'],
  dateFrom: null,
  dateTo: null,
  unitNumber: null,
  customerName: null,

actions: {
    submitQuery() {
      switch (module) {
        case 'Option 1 List':
          this.transitionToRoute('reports.option1', {
            queryParams: {
              dateFrom: this.get('dateFrom'),
              dateTo: this.get('dateTo'),
              unitNumber: this.get('unitNumber'),
             customerName: this.get('customerName'),
          },
      })

          break;
}

这是嵌套的路由：

import Route from '@ember/routing/route';

export default Route.extend({
  queryParams: {
  dateFrom: { as: 'meddateFrom',
refreshModel:true},
  dateTo: { as: 'meddateTo', refreshModel:true},
  unitNumber: { as: 'medunitNumber', refreshModel:true},
  customerName: { as: 'medcustomerName', refreshModel:true},
},

  model(params) {

      return this.get('store').query('option1api', params)

      },

});

我一定是在这里做错了什么，因为这会产生一些糟糕的行为。我最终在 URL 字符串中将查询参数加倍。我还以错误的参数更新行为结束，这会影响我在输入更改时重新运行查询的能力。

如果我不在嵌套路由中包含 queryParams 对象查询不会触发，也不会生成任何内容。
如果我不在我收到的嵌套路由中为 queryParams 添加别名错误告诉我不能有重复的键值多个控制器。
我尝试使用 paramsFor 而不是上面的 queryParams 并且可以没有结果。

我也无法再次按下“提交”按钮来启动新的查询。我认为这是因为我正在尝试转换到已加载的路线。

我考虑过将 queryParams 从控制器移动到父路由 (reports.js)，但据我了解，我首先需要控制器设置 queryParams。

This question 看起来非常相似，但不幸的是没有太多可用的答案。

谁能发现我的大错误或指出正确的方向？ EmberJS 指南中提供的文档对我目前的理解没有帮助。

Answer 1

我通过改变方法自行解决了这个问题。

我没有按照我的问题在控制器上处理查询参数，而是使用 {refreshModel:true} 选项将它们移动到父路由。

在嵌套路由中我添加了以下内容：

let dateFrom = this.paramsFor('reports').dateFrom
let dateTo = this.paramsFor('reports').dateTo
let unitNumber = this.paramsFor('reports').unitNumber
let customerName = this.paramsFor('reports').customerName

let hash = {dateFrom, dateTo, unitNumber, customerName}

return this.get('store').query('mymodel', hash)

这证实了我的子路径能够读取查询参数，然后我可以使用这些变量为我的模型查询构造哈希。

我不知道以上是否是最佳实践，但它让我振作起来运行为我的子路径实时刷新。

EmberJS - 将查询参数从控制器传递到嵌套路由

EmberJS - Passing Query Params from Controller to Nested Route

javascript

ember.js