EmberJS-將查詢參數從控制器傳遞到嵌套路由

Question

我目前有一個具有多個輸入的表單。 這些輸入用於填充查詢參數。 在此路由的控制器上，Submit操作將注冊查詢參數輸入，並使用transitionToRoute加載顯示查詢返回的信息的嵌套路由。

這是控制器的相關部分：

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進行別名，則會收到錯誤消息，告訴我在多個控制器中不能有重復的Key值。

• 我嘗試使用paramsFor而不是上面的queryParams，但無法產生結果。

我也無法再次按下Submit按鈕來啟動一個新的查詢。 我認為這是因為我試圖過渡到已加載的路由。

我考慮過將queryParams從控制器移動到父路由（reports.js），但據我了解，我需要控制器在第一個實例中設置queryParams。

這個問題似乎非常相似，但不幸的是，答案不多。

誰能發現我的重大錯誤或為我指明正確的方向？ 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)

這證實了我的子路由能夠讀取queryparams，然后可以使用變量為模型查詢構造哈希。

我不知道上面的方法是否是最佳實踐，但它使我的子路由實時刷新。