javascript - 是否存在将对象键名称映射到更易读的表示形式的正确方法？

我的服务器返回一个如下所示的对象：

{
   firstName: "Joe",
   lastName: "Smith",
   phoneNum: "212-222-2222"
}

我想用*ngFor在ui（内置的angular 2+）中显示这个，但我不想像现在这样使用键名。我想要更方便的东西，比如

First Name: Joe
Last Name: Smith
Phone Number: 212-222-2222

是否有一个“适当”的方法来提供从键名到用户友好的键名的映射？如果不是，我可能会做些什么来确保密钥名是camel大小写的，然后在ui中，使用函数将camel大小写的密钥名转换为间隔的用户友好名称。
但如果有人建议我不要在服务器端更改任何内容，而是在ui上进行映射，那就太酷了。

最佳答案

公开字段映射程序的接口。

interface FieldMapper {
   firstName: string,
   lastName: string,
   phoneNumber: string,
}

interface LabeledField {
  label: string,
  value: string,
}

interface UserRenderable {
  firstname: LabeledField,
  lastname: LabeledField,
  phoneNumber: LabeledField,
}

在你的组件中使用这个，例如。

@Component({
    ...
    template: `
        <ul>
        <li *ngFor="#user of users">{{user.firstname.label}}
            {{user.firstname.value}}</li>
        <ul>
    `
})
export class Users {
    users: Array<UserRenderable>
    fieldMapper: FieldMapper = {
        firstName: 'First Name',
        lastName: 'Last Name',
        phoneNumber: 'Phone Number'
    }

    constructor(private userService : UserService) {
      const users = userService.get();
      this.users = users.map((u) => (
        Object.keys(
          this.fieldMapper
        )
        .reduce(
          (prev, currKey) => {
            prev[currKey] = {
              label: this.fieldMapper[k],
              value: u[k]
            }
            return prev;
          }, {})
      ));
    }

    ngOnInit() {

    }
}