Two kinds of labels for options in select dropdown-CodePudding

Using angularjs, I want to change what is being used as the label. I have objects which are either companies or people, and use a different value to display as the label. So with the example below, my dropdown options should read: Aida Whitburg, Jones Investments, Edison Yuen, using either the name as the value if it's a person or companyName if the entry is a company.

{ id: 1,
 name: "Aida Whitburg",
 type: "person"
},
{ id: 2,
  companyName: "Jones Investments",
  type: "company"},
{ id: 3,
  name: "Edison Yuen",
  type: "person"
}

    <select id="entityDropdown" 
            ng-options="entity as entity.name for entity in ctrl.entities" 
            ng-model="ctrl.model.markedEntity"  
            ng-change="ctrl.onChangeModel()">
    </select>

CodePudding user response：

make a new object with merged field and use it, something like that:

let people = [
{
    "id": 1,
    "name": "Aida Whitburg",
    "type": "person"
},
{
    "id": 2,
    "companyName": "Jones Investments",
    "type": "company"
},
{
    "id": 3,
    "name": "Edison Yuen",
    "type": "person"
}
].map(p => {
  p.label = p.name || p.companyName
  return p;
});

console.log(people)