CODEWITHSUNDEEP
angularjsng-options
Rishi Prakash
Rishi Prakash

Reputation: 1789

how to create a combination of two properties as "name" in ng-options

Normally what we do is 

...}}_{{$index}}" ng-options="option.serial_no as option.NameRelation for option in fullFamilydetails" ng-model="obj.ch6a_decl_fam_memb_id">

and on Java I am doing 

...
familyDetails.put("NameRelation", Emp_FamilyInfoTemp.getName()+"-"+Emp_FamilyInfoTemp.getRelation());
                            }else{
...

As you see I am handling it on java to show "NAME" - "RELATION" pair as "name of ng-options"

but what I want is to keep NAME and RELATION as different properties in json but show a combination of them while creating ng-options, all and all I want to create the same effect while keeping the properties separate.

Current Sample Json 

[{"DOB":"2014-09-03 00:00:00.0","NameRelation":"MaleChildTest-Son","SERIAL_NO":55213,"AGE":"0"},{"DOB":"2014-09-12 00:00:00.0","NameRelation":"FemaleChildTest-Daughter","SERIAL_NO":55216,"AGE":"0"},{"DOB":"2014-09-12 00:00:00.0","NameRelation":"MaleChildTesEmp-Son","SERIAL_NO":55217,"AGE":"0"},{"DOB":"2014-09-12 00:00:00.0","NameRelation":"FemaleChildEmployeeTest-Daughter","SERIAL_NO":55218,"AGE":"0"},{"DOB":"","NameRelation":"Test-Father","SERIAL_NO":55219,"AGE":"0"}]

supposed JSON 

[{"DOB":"2014-09-03 00:00:00.0","Name":"MaleChildTest","Relation":"Son","SERIAL_NO":55213,"AGE":"0"}....]

In dropdown I want Name-Relaiton as "name" of options.

Upvotes: 2

Views: 841

Answers (2)

mohamedrias
mohamedrias

Reputation: 18576

DEMO

<select  ng-options="option.serial_no as label(option.Name, option.Relation)  for option in fullFamilydetails" ng-model="obj"></select>

In your JS:

angular.module("SO29137733", [])
    .controller("MainCtrl", function ($scope) {
    $scope.fullFamilydetails = [{
        "DOB": "2014-09-03 00:00:00.0",
            "Name": "MaleChildTest",
            "Relation": "Son",
            "SERIAL_NO": 55213,
            "AGE": "0"
    }, {
        "DOB": "2014-09-03 00:00:00.0",
            "Name": "MaleChildTest",
            "Relation": "Son",
            "SERIAL_NO": 55213,
            "AGE": "0"
    }];
    $scope.label = function (name, relation) {
        return name + "-" + relation;
    }
});

Another option:

DEMO

<select>
  <option ng-repeat="option in options" value="{{option.serial_no}}">
    {{option.name + " "+option.relation}}
  </option>
 </select>

In your JS:

angular.module("SO29137733", []) 
   .controller("MainCtrl", function($scope){
  $scope.options = [{
    serial_no : "123",
    name : "hi",
    relation: "parent"
  },
                   {
    serial_no : "1233",
    name : "sa",
    relation: "sdf"
  }];
})

Upvotes: 2

Janaki Sathiyamurthy
Janaki Sathiyamurthy

Reputation: 588

If you want to show it as single pair of option then do as below,

ng-options="option.serial_no as (option.name+' '+ option.relation) for option in fullFamilydetails"

Upvotes: 2

Related Questions