Question

如果查询参数值为默认值，则Ember不会在url中显示查询参数。但我想表明一下。是否可以选择更改此行为以显示而不是隐藏？

App.IndexController = Ember.ArrayController.extend({
  queryParams: ['type'],
  type: "horror"  // the default value, won't appear in URL or params
})

Answer 1

this guide section中说明了默认值和序列化。不幸的是，它没有提供包含默认值的方法，我不确定是否有开箱即用的方法。

然而，有一个小技巧。不要将默认值放在控制器中，而是使用null并在设置查询参数时设置路由中的默认值。从你的角度来看，这会诱使Ember认为它不是默认值。

App.IndexRoute = Ember.Route.extend({
    resetController: function(controller) {
        controller.set('type', 'horror');
        return this._super.apply(this, arguments);
    }
});

App.IndexController = Ember.ArrayController.extend({
    queryParams: ['type'],
    type: null
});

Answer 2

我尝试将初始值设置为null，但它并不总是有效：有时我的查询参数会显示在URL中，有时则不会。如果查询参数不在URL中，我通过window.history.replaceState（）操作浏览器历史记录来解决这个问题。我将代码放在我的setter中的Ember.run.schedule（'afterRender'，this，function（）{...}）中，以便我的逻辑在Ember完成渲染后运行。

export default Ember.Controller.extend({
    setMyParam: function(newValue) {
        if (newValue !== null && typeof(newValue) !== 'undefined') {
            Ember.set(this, 'myParam', newValue);
            Ember.run.schedule('afterRender', this, function() {
                window.location.toString().match(/^(.+?)(\?.+)$/); // $1 = base URL, $2 = query params
                var queryParams = RegExp.$2;
                if (queryParams) {
                    if (queryParams.indexOf('myParam') === -1) {
                        console.log('No myParam in query parameters. Setting myParam=' + newValue);
                        window.history.replaceState({}, document.title, window.location.toString() + '&myParam=' + newValue);
                    }
                } else {
                    // No query parameters, so add it as the first query parameter
                    console.log('No query parameters, so adding myParam=' + newValue + ' as the first query parameter.');
                    window.history.replaceState({}, document.title, window.location.toString() + '?myParam=' + newValue);
                }
            });
         } else {
             console.log('setMyParam: newValue=' + newValue + ' is null or undefined. Not setting it!');
         }
    }
});

如何在ember中的url中显示默认查询参数值？

2 个答案: