动态更新查询参数

Question

在 ember.js 中，您如何动态更新查询参数？

export default Ember.Controller.extend({
    myQuery: "test",

    queryParams: ["myQuery"],

    actions: {
       click() {
          this.set("myQuery", "update query param");
      }
    }
});


export default Ember.Route.extend({
  queryParams: {
    myQuery: { refreshModel: true }
  },
  model(params) {
    console.log(params)
  }
});

当触发动作时，应该再次调用模型挂钩，除非我错了？

Please find an example here，导航到 /test 路线并单击按钮。在控制台中，您可以看到模型挂钩没有再次触发。

Answer 1

您的问题与以下事实有关：您没有使用 action 帮助程序将操作传递给 my-button 组件并从 test.hbs 内部传递 click=actions.click 之类的操作.当你这样做时； Emberjs 未正确设置 click 函数的运行的 this 上下文。也就是说，如果你调试你的代码，你就会看到它；当 test.js 控制器中的 click 动作实际上设置为 my-button 组件时，你的这个上下文。这意味着您只是设置 my-button 组件的 myQuery 属性；这对控制器的 myQuery 属性没有任何作用；因此，控制器的属性不会更新，因此即使您将其声明为 refreshModel: true.

，模型挂钩也不会再次运行

你能做什么？只需使用 action 助手，一切都会正常进行。只需检查以下 twiddle。 url 将被更新，模型挂钩将按照您的意愿执行。请记住； action 助手对于设置正确的 this 上下文至关重要，即使它看起来像是一个正常的函数传递和调用。

动态更新查询参数

Dynamically updating query params

ember.js