Soumya Gangamwar Soumya Gangamwar - 3 months ago 10
jQuery Question

how to print two properties in drop down in angular js?

I have json array like here

$scope.parentChartId = [
{
"id": 1,
"chart_name": "pieChart",
"sub_chart_query_param": "id,part,name"
},
{
"id": 2,
"chart_name": "pieChart1",
"sub_chart_query_param": "id,part,name"
},
{
"id": 3,
"chart_name": "pieChart2",
"sub_chart_query_param": "id,part,name"
}
]


I want show in select-menu(drop down values like)

1-pieChart1,
2-pieChart2,
3-pieChart3


Is there any way to do it. any one please help me

Answer

Demo https://jsfiddle.net/nuwanniroshana/pgyj95pd/

HTML markup

<select ng-options="item as item.id + ' - ' + item.chart_name for item in parentChartId track by item.id" ng-model="selected"></select>

Angular Implementation

(function(angular) {
  angular.module('myApp', [])
    .controller('mainController', function($scope) {

      $scope.parentChartId = [{
        "id": 1,
        "chart_name": "pieChart",
        "sub_chart_query_param": "id,part,name"
      }, {
        "id": 2,
        "chart_name": "pieChart1",
        "sub_chart_query_param": "id,part,name"
      }, {
        "id": 3,
        "chart_name": "pieChart2",
        "sub_chart_query_param": "id,part,name"
      }];
    });

})(window.angular)
Comments