how to Set Dropdown to display Text not by value in angularjs ? [Resolved]

Posted by Kasani007 under AngularJS 1x on 1/30/2017 | Points: 10 | Views : 1096 | Status : [Member] | Replies : 1

Write New Post |

Search Forums | Answered

Resolved Posts |

Un Answered Posts |

Forums Home

how to Set Dropdown to display Text not by value in angularjs ?

[Resolved]

Reply | Reply with Attachment

Alert Moderator

Responses

Posted by: A2H on: 1/30/2017 [Member] [MVP] Silver | Points: 50

0	You can use the ng-model option to selected item in dropdownlist instead of using Value <select ng-model="selected.item" ng-options="c for c in drpitems"></select> Complete Code <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <body> <div ng-app="myApp" ng-controller="myCtrl"> <select ng-model="selected.item" ng-options="c for c in drpitems"></select> </div> <script> var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { //items for dropdownlist $scope.drpitems = ['FirstItem', 'SecondItem', 'ThridItem', 'FourthItem', 'FiveItem']; //Set the selected item in scope $scope.selected = { item: $scope.drpitems[2] }; }); </script> </body> </html> Sample Demo http://jsbin.com/cazixurohi/edit?html,output Thanks, A2H My Blog Kasani007, if this helps please login to Mark As Answer. \| Alert Moderator

You can use the ng-model option to selected item in dropdownlist instead of using Value

<select ng-model="selected.item" ng-options="c for c in drpitems"></select>

Complete Code

<!DOCTYPE html>

<html>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>



<div ng-app="myApp" ng-controller="myCtrl">

<select ng-model="selected.item" ng-options="c for c in drpitems"></select> 

</div>

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {

  //items for dropdownlist

    $scope.drpitems = ['FirstItem', 'SecondItem', 'ThridItem', 'FourthItem', 'FiveItem']; 

  //Set the selected item in scope

    $scope.selected = { item: $scope.drpitems[2] }; 

 

});

</script>



</body>

</html>

Sample Demo

http://jsbin.com/cazixurohi/edit?html,output

Thanks,
A2H
My Blog

Kasani007, if this helps please login to Mark As Answer. | Alert Moderator

Latest Posts