Angular ng-options remove blank option and select the first option only

Question

I am using AngularJS to populate my select options content dynamically from an array of objects in my controller. My objects has a property named userProfileName

Answer 1

Do this :)

In your controller :

 function myCtrl ($scope) {
   $scope.userProfiles = [
     {id: 10, name: 'Carton'},
     {id: 27, name: 'Bernard'},
     {id: 39, name: 'Julie'},
  ];

   $scope.selectedUserProfile= $scope.userProfiles[0]; // Set by default the   value "carton"
  };

In your page :

      <select  id="requestorSite" ng-model="selectedUserProfile" ng-options="userProfile as userProfile.name for userProfile in userProfiles">
            </select>

CodePen: http://codepen.io/anon/pen/qdOGVB

Answer 2

This has several solution. The following worked best for me. Just initialize the model with the first value. The ng-init="myItem = items[0].name" does the trick

<select ng-if="items" ng-init="myItem = items[0].name" ng-model="myItem">
     <option ng-repeat="item in items" ng-value="item.name">{{item.name}}</option>
</select>