打字稿自定义映射到对象

Question

我正在开发一个 Angular 应用程序，该应用程序正在映射来自

的响应

return this.http.get(this.url)
      .toPromise()
      .then(response => response as IValueSetDictionary[])
      .catch(this.handleError);

到以下界面

export interface IValueSetDictionary {
  valueSet: {};
}

这映射了来自第 3 方服务的响应，returns JSON 响应类似于

{
  "<CONCENTRATE> | 6": "<CONCENTRATE>",
  "<PHYSICAL> | 5": "<PHYSICAL>",
  "NYMEX WARRANT IN MT | 12": "NYMEX WARRANT IN MT",
  "SHFE WARRANT | 13": "SHFE WARRANT"
}

我需要一些帮助来从响应中删除“<”和“>”。

期望的输出

{
  "CONCENTRATE | 6": "CONCENTRATE",
  "PHYSICAL | 5": "PHYSICAL",
  "NYMEX WARRANT IN MT | 12": "NYMEX WARRANT IN MT",
  "SHFE WARRANT | 13": "SHFE WARRANT"
}

基本上，我想在映射响应时去掉“<>”标签。我一直无法在打字稿中想出一个巧妙的方法来做到这一点。

Answer 1

一种方法是将对象字符串化，使用给定的 RegEx 删除括号并再次解析结果。

注意：如果对象可以包含 keys/values like

，这可能是个问题

'some < string which randomly contains opening and closing > brackets '

function removeAngleBrackets(obj) {
    const jsonString = JSON.stringify(obj);
    const result= jsonString.replace(/<(.*?)>/g,'');
    return JSON.parse(result);
}

let o = {
  "<CONCENTRATE> | 6": "<CONCENTRATE>",
  "<PHYSICAL> | 5": "<PHYSICAL>",
  "NYMEX WARRANT IN MT | 12": "NYMEX WARRANT IN MT",
  "SHFE WARRANT | 13": "SHFE WARRANT"
}

console.log(removeAngleBrackets(o));

Answer 2

Basically, I want to get rid of the '<>' tags while mapping the response. I have not been able to figure out a neat way to do this in typescript.

和打字稿关系不大，javascript也是一样。您需要做的是将您获得的对象转换为所需的形式。尝试这样的事情：

return this.http.get(this.url)
      .toPromise()
      .then(response => response as IValueSetDictionary[])
      .then((value) => value.map((vs) => this.cleanValueSet(vs)))
      .catch(this.handleError);

cleanValueSet 函数是实际替换不需要的字符并将对象放回原处的函数：

private cleanValueSet = (vs: IValueSetDictionary): IValueSetDictionary => {
  const result = Object.keys(vs.valueSet).reduce((acc, rawKey) => {
    const key = rawKey.replace(/[\<\>]/g, '');
    const value = (vs.valueSet[rawKey] as string).replace(/[\<\>]/g, '');
    acc[key] = value;
    return acc;
  }, {} as { [key: string]: string });

  return { valueSet: result };
};

打字稿自定义映射到对象

Typescript Custom Mapping to object

casting

typescript

angular