在Ember.js中查询参数的URL编码

Question

我1.7.0-beta.1在我的最新项目中使用了Ember.js版本.我使用查询参数功能使列表在硬刷新后仍然存在(例如,在重新加载之后,仍然选择列表中的所选项).

我有一个控制器来管理:

export default Ember.ObjectController.extend({
    queryParams: [{selectedFiles: 'files'}],
    selectedFiles: Ember.A([]), //list of file ids

    ... //other props

    actions: {
    selectFile: function(file) {
        //set or remove the file id to the selectedFiles property
    }
});

它工作得很棒,但有一个条件:url是url编码的:

Chrome和IE:

路径/ 354？文件=%5B "6513" %2C "6455" %2C "6509" %2C "6507" %2C "6505" %2C "6504" %2C "6511" %5D

FF(自动设置括号):

路径/ 354？文件= "6513" %2C "6455" %2C "6509" %2C "6507" %2C "6505" %2C "6504" %2C "6511"]

在Ember中有一种方法可以将query-param-string解码为更易读的格式吗？也许我可以在decodeURIComponent()某个地方使用这个功能？

所需的输出:

路径/ 354？文件= [ "6513", "6455", "6509", "6507", "6505", "6504", "6511"]

Answer 1

我有一个非常类似的问题,并通过覆盖serializeQueryParam和deserializeQueryParam路线使其工作.

在控制器中你会有:

queryParams: ['files'],
files: []

并在路线:

  serializeQueryParam: function(value, urlKey, defaultValueType) {
    if (defaultValueType === 'array') {
      return value;

      // Original: return JSON.stringify(value);
    }
    return '' + value;
  }, 

和:

  deserializeQueryParam: function(value, urlKey, defaultValueType) {

    if (defaultValueType === 'array') {

      var arr = [];
      for (var i = 0; i < value.length; i++) {
        arr.push(parseInt(value[i], 10));
      }      

      return arr;

      // Original: return Ember.A(JSON.parse(value));
    }

    if (defaultValueType === 'boolean') {
      return (value === 'true') ? true : false;
    } else if (defaultValueType === 'number') {
      return (Number(value)).valueOf();
    }
    return value;
  }, 

该网址将变为如下:

?files[]=1&files[]=2&files[]=3

那将是服务器端的真实阵列.

在jsbin.com上查看这个工作示例