configure the text label in angularjs

Question

I want to configure the text label user friendly. eg http response be like

[
  {
    "approved_datetimestamp": "",
    "approved_by": "",
    "effective_datetimestamp": "",
    "act_datetimestamp": "",
    "expiry_datetimestamp": "",
    "rejected_datetimestamp": "",
    "rejected_by": ""
  }
]

Here, the key is a label, I want to configure that key. E.g. approved_datetimestamp would be Approved Datetimestamp.

I have approach that we can create constant variable like

const approved_datetimestamp = "Approved Datetimestamp";

when we displaying in template, I am using:

<div class="col-sm-6">{{row[rcolumn] | uppercase}}</div>

or else capitalise first letter of each word and replace underscore with a space. am expacting this

Do you want to capitalise first letter of each word and replace underscore with a space or...? It's not clear to me what you need this array of object(s) for. — LazioTibijczyk, Oct 30 '18 at 12:39
Yes your idea also good. capitalise first letter of each word and replace underscore with a space. am expacting this — Jay, Oct 30 '18 at 12:49

LazioTibijczyk · Answer 1 · 2018-10-30T14:07:58.423

1

Here it is, iterate through object properties, split them on underscore and capitalise each word, then assign it to the property.

var object = {
    "approved_datetimestamp": "jsjs",
    "approved_by": "",
    "effective_datetimestamp": "",
    "act_datetimestamp": "",
    "expiry_datetimestamp": "",
    "rejected_datetimestamp": "",
    "rejected_by": ""
};

for(var property in object) {
   var newProperty = property.toLowerCase()
                             .split('_')
                             .map((s) => s.charAt(0).toUpperCase() + s.substring(1))
                             .join(' ');
   object[newProperty] = object[property];
   delete object[property];
}

console.log(object);

edited Oct 30 '18 at 14:07

answered Oct 30 '18 at 12:57

LazioTibijczyk

1,701
21
48

expected results `{ "Approved Datetimestamp": "", "Approved By": "", }` Instead of `{ "approved_datetimestamp": "Approved Datetimestamp", "approved_by": "Approved By"}` – Jay Oct 30 '18 at 13:20
@Vijay you can create a new object with those keys, instead of properties of existing keys using the same filter – Aleksey Solovey Oct 30 '18 at 13:29
@AlekseySolovey if put object[key] instead of object[property] – Jay Oct 30 '18 at 13:42
`for(var property in object) { if(object[keys(property)] !=undefined){ object[keys(property)] = object[keys(property)] .split('_') .map((s) => s.charAt(0).toUpperCase() + s.substring(1)) .join(' '); } }` – Jay Oct 30 '18 at 13:56
the above returns the same as it is – Jay Oct 30 '18 at 13:57
Can you accept the answer if this is what you expected? It will help others too. – LazioTibijczyk Oct 31 '18 at 12:54

score 1 · Answer 2 · answered Oct 30 '18 at 13:56

You are thinking about creating dynamic keys

You need to create a key with some filter (I got the code from LazioTibijczyk), then simply pass it into an object to assign it. It will create that new key dynamically. Here is a demo of it:

var object = {
  "approved_datetimestamp": "",
  "approved_by": "",
  "effective_datetimestamp": "",
  "act_datetimestamp": "",
  "expiry_datetimestamp": "",
  "rejected_datetimestamp": "",
  "rejected_by": ""
};

var new_object = {};

for (var property in object) {
  var new_key = property.toLowerCase()
    .split('_')
    .map((s) => s.charAt(0).toUpperCase() + s.substring(1))
    .join(' ');
  new_object[new_key] = "";
}

console.log(new_object);

configure the text label in angularjs

2 Answers2