How to remove empty entry from ng-repeat Angulst JS

Question

Hi This is my html code

 <select style="width: 199px;margin-top: -9px;" id="ddlTypeCode" ng-model="selectedCountryCode" ng-change="locationChange(selectedCountryCode)" name="ddlTypeCode" class="form-control">
                    <option ng-repeat="Country in CountryList track by $index" value="{{Country}}"
                            ng-selected="Country == 'India'">
                        {{Country}}
                    </option>

CountryList don't have any empty value but in UI Drop down showing one empty entry.Please suggests

score 1 · Answer 1 · answered Aug 20 '18 at 13:57

Its a common thing in angularjs when using arrays with ng-repeat.

Its simple, just add an <option> tag with style="display:none" i.e <option style="display:none"></option> It does the job.

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

app.controller('testCtrl', ['$scope', function ($scope) {
 $scope.CountryList = ["India", "China", "Japan"]; 
   
   
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="testCtrl">
    
<select style="width: 199px;margin-top: -9px;" id="ddlTypeCode" ng-model="selectedCountryCode" ng-change="locationChange(selectedCountryCode)" name="ddlTypeCode" class="form-control">
          <option  style="display:none;"></option>
         <option ng-repeat="Country in CountryList " value="{{Country}}"ng-selected="Country == 'India'">
                        {{Country}}
                    </option>
        

</div>

Hope it helps.. Cheers!

~ NiKhIl

`track by $index` is used if there are any duplicate entries, there's no need here I guess. — Nikhil Zurunge, Aug 20 '18 at 14:00

score -1 · Answer 2 · answered Aug 20 '18 at 09:19

-1

The empty option is generated when a value referenced by ng-model doesn't exist in a set of options passed to ng-options.

have a look at Why does AngularJS include an empty option in select?

answered Aug 20 '18 at 09:19

Ahsan Haroon

21
4

@Adriani6 why down vote ? becuase lack of reputation cant comment. i post answer faster then you – Ahsan Haroon Aug 20 '18 at 09:24
You can't just post this as an answer. The board will be a mess if everyone does. When you have enough rep you can then post comments. The system was designed this way and you should accept and follow that. You don't have to use comments. At 15 reputation, you'll see a 'flag' option which we use to flag questions as duplicates to also keep the forums nicely organised and tidy. It all comes with patience :) – Adrian Aug 20 '18 at 09:27
if i cant post comment how does i gain reputation ? – Ahsan Haroon Aug 20 '18 at 09:30
By answering questions you can in the mean time. I know it sounds hard but we all had to start at the same place :) – Adrian Aug 20 '18 at 09:32
ok understood now – Ahsan Haroon Aug 20 '18 at 09:36

How to remove empty entry from ng-repeat Angulst JS

2 Answers2