Remove empty option that appears in AngularJs

Question

Problem: Currently I have a form that displays data that is being grabbed from a database. It works fine to display the options when the user selects the drop down box.

However, their is a blank option appearing in the dropdown box, right after the placeholder. I have looked up how to remove it but nothing has worked.

Here is the form (I was not able to get the ng-option to work so I tried the code that was not commented out which works for the most part).

any help would be appreciated

<div class="form-group">
    <select class="form-control" id="city" ng-model="searchParam.City">
        <option selected="selected" value="">City</option>
        <!---<option value=""></option>--->
        <cfoutput query="cityFind">
            <option value=#city#>#city#</option>
        </cfoutput> 
    </select>

    <!---<select class="form-control" id="city" ng-model="searchParam.City">
        <option disabled="disabled" selected="selected" value="">City</option>
        <option ng-repeat="c in Cities">{{c.City}}</option>
    </select>---->
</div>

(
function(){
 var $scope, $location;
 var indexApp = angular.module('indexApp',['ui.bootstrap']);
 
 indexApp.controller('IndexController',function($scope,$http,$location,anchorSmoothScroll){
  $scope.Lang = 'initVal';
  $scope.ShowResults = false;
  $scope.ShowDesc = true;
  $scope.NoResults = false;
  $scope.currentPage = 1;
  $scope.maxPageNumbersToShow = 10;
  $scope.formModel = {};
  $scope.searchMode = 0;
  $scope.miles = [{'value':'5'},{'value':'10'},{'value':'15'},{'value':'20' }];
  $scope.Specialties = [{'value':'Family practice'},{'value':'General practice'},{'value':'Internal medicine'},{'value':'Pediatrics'}];
  $scope.Gender = [{'value':'Male'},{'value':'Female'}];
  $scope.Languages = {};
  $scope.Cities = {};
  $scope.searchParam = {};
  $("input").removeAttr('disabled');
  
  $scope.searchParam.Distance = $scope.miles[0];
  
  $scope.GetCurrentZip = function (){
   try{
    var lon, lat;
    // console.log('starting geoposition code.');
    if("geolocation" in navigator){
     window.navigator.geolocation.getCurrentPosition(function(pos){
      lat = pos.coords.latitude.toFixed(3);
      lon = pos.coords.longitude.toFixed(3);
      // console.log(lat + ' ' + lon);
      $http.get("/remote/ReturnCurrentZipcode.cfm?Lat=" + lat + "&Lon=" + lon)
      .then(function(response){
       $scope.searchParam.Zip = response.data;
      })
     })
    }
    else{ console.log('No geolocation'); }
   }
   catch(err) { console.log(err.message); }
  }
  
  $scope.GetCityList = function (){
   try{
    $http.get("/remote/ReturnCityList.cfm")
     .then(function(response){
      $scope.Cities = response.data.Cities;
     })
   }
   catch(err){}
  }
  
  $scope.GetLangList = function (){
   try{
    $http.get("/remote/ReturnLangList.cfm")
     .then(function(response){
      $scope.Languages = response.data.Languages;
     })
   }
   catch(err){}
  }
  
  $scope.SearchProvider = function(searchParam){
   try{
    $scope.searchMode = 1;
    var queryString='';
    if($scope.formModel && $scope.formModel !== searchParam){
     $scope.resultsCount = 0;
     currentPage = 1;
    }
    if(searchParam){
     $scope.formModel = searchParam;
     for(var param in searchParam){
      if(searchParam.hasOwnProperty(param)){
       var paramValue = searchParam[param].value ? searchParam[param].value.trim() : searchParam[param].trim();
       if (paramValue.length > 0)
        queryString += param + '=' + paramValue + '&';
      }
     }
    }
    console.log(queryString);
    queryString= '?' + queryString + 'currentpage=' + $scope.currentPage;
    
    $http.get("/remote/ReturnProvidersList.cfm" + queryString)
    .then(function(response){
     $scope.providers = response.data.provider;
     $scope.resultsCount = response.data.rowCount;
     if (!$scope.providers){
       $scope.NoResults = true;
       $scope.ShowResults = false;
       $scope.ShowDesc = false;
      }
     else{
       $scope.NoResults = false;
       $scope.ShowResults = true;
       $scope.ShowDesc = false;
      }
    })
   }
   catch(err){ alert('No response.: ' + err.message); }
  }
  
  $scope.$watchGroup(['currentPage'], function(){
   try{
    if($scope.searchMode == 1){
     $scope.SearchProvider($scope.formModel);
     }
   }
   catch(err){}
  });
  

  $scope.GetCityList();
  $scope.GetLangList();
  $scope.GetCurrentZip();
  
  $scope.gotoElement = function (eID){
   //http://jsfiddle.net/brettdewoody/y65G5/
     // set the location.hash to the id of
     // the element you wish to scroll to.
     
   //$location.hash('bottom');
   
     // call $anchorScroll()
   var browserWidth = screen.availWidth;
   if (browserWidth < 768)
    anchorSmoothScroll.scrollTo(eID);
  };
 
 });
 
 indexApp.service('anchorSmoothScroll', function(){
  this.scrollTo = function(eID) {

   // This scrolling function 
   // is from http://www.itnewb.com/tutorial/Creating-the-Smooth-Scroll-Effect-with-JavaScript
   
   var startY = currentYPosition();
   var stopY = elmYPosition(eID);
   var distance = stopY > startY ? stopY - startY : startY - stopY;
   if (distance < 100) {
    scrollTo(0, stopY); return;
   }
   var speed = Math.round(distance / 100);
   if (speed >= 20) speed = 20;
   var step = Math.round(distance / 25);
   var leapY = stopY > startY ? startY + step : startY - step;
   var timer = 0;
   if (stopY > startY) {
    for ( var i=startY; i<stopY; i+=step ) {
     setTimeout("window.scrollTo(0, "+leapY+")", timer * speed);
     leapY += step; if (leapY > stopY) leapY = stopY; timer++;
    } return;
   }
   for ( var i=startY; i>stopY; i-=step ) {
    setTimeout("window.scrollTo(0, "+leapY+")", timer * speed);
    leapY -= step; if (leapY < stopY) leapY = stopY; timer++;
   }
   
   function currentYPosition() {
    // Firefox, Chrome, Opera, Safari
    if (self.pageYOffset) return self.pageYOffset;
    // Internet Explorer 6 - standards mode
    if (document.documentElement && document.documentElement.scrollTop)
     return document.documentElement.scrollTop;
    // Internet Explorer 6, 7 and 8
    if (document.body.scrollTop) return document.body.scrollTop;
    return 0;
   }
   
   function elmYPosition(eID) {
    var elm = document.getElementById(eID);
    var y = elm.offsetTop;
    var node = elm;
    while (node.offsetParent && node.offsetParent != document.body) {
     node = node.offsetParent;
     y += node.offsetTop;
    } return y;
   }

  };
  
 });
 
 indexApp.directive('allowPattern',[allowPatternDirective]);
 indexApp.directive('popPopup',[describePopup]);
 indexApp.directive('pop', function pop ($tooltip, $timeout) {
    var tooltip = $tooltip('pop', 'pop', 'event');
    var compile = angular.copy(tooltip.compile);
    tooltip.compile = function (element, attrs) {      
      var first = true;
      attrs.$observe('popShow', function (val) {
        if (JSON.parse(!first || val || false)) {
   $timeout(function(){
    element.triggerHandler('event');
   });
   }
   first = false;
  });
  return compile(element, attrs);
  };
  return tooltip;
 });
 
 indexApp.filter('PhoneNumber', function(){
 return function(phoneNumber){
  var dash = '-';
  var openParen = '(';
  var closeParen = ') ';
  if(phoneNumber){
   var pn = phoneNumber;
   pn = [pn.slice(0, 6), dash, pn.slice(6)].join('');
   pn = openParen + [pn.slice(0, 3), closeParen, pn.slice(3)].join('');
   return pn;
   }
  return phoneNumber;
  }
 });
 
 indexApp.filter('Zip', function(){
 return function(zipcode){
  var dash = '-';
  if(zipcode && zipcode.length > 5){
   var zc = zipcode;
   zc = [zc.slice(0, 5), dash, zc.slice(5)].join('');
   return zc;
   }
  return zipcode;
  }
 });
 
 function allowPatternDirective(){
  return{
   restrict: "A",
   compile: function(tElement, tAttrs){
    return function(scope, element, attrs){
     element.bind("keypress", function(event){
      var keyCode = event.which || event.keyCode;
      var keyCodeChar = String.fromCharCode(keyCode);
      
      if(!keyCodeChar.match(new RegExp(attrs.allowPattern, "i"))){
       event.preventDefault();
       return false;
      }
     });
    }
   }
  }
 }

 function describePopup(){
  return {
   restrict: 'EA',
   replace: true,
   scope: { title: '@', content: '@', placement: '@', animation: '&', isOpen: '&' },
   templateUrl: 'template/popover/popover.html'
   };
  }
})();
(function($) {
  // @todo Document this.
  $.extend($,{ placeholder: {
      browser_supported: function() {
        return this._supported !== undefined ?
          this._supported :
          ( this._supported = !!('placeholder' in $('<input type="text">')[0]) );
      },
      shim: function(opts) {
        var config = {
          color: '#888',
          cls: 'placeholder',
          selector: 'input[placeholder], textarea[placeholder]'
        };
        $.extend(config,opts);
        return !this.browser_supported() && $(config.selector)._placeholder_shim(config);
      }
  }});

  $.extend($.fn,{
    _placeholder_shim: function(config) {
      function calcPositionCss(target)
      {
        var op = $(target).offsetParent().offset();
        var ot = $(target).offset();

        return {
          top: ot.top - op.top,
          left: ot.left - op.left,
          width: $(target).width()
        };
      }
      function adjustToResizing(label) {
       var $target = label.data('target');
       if(typeof $target !== "undefined") {
          label.css(calcPositionCss($target));
          $(window).one("resize", function () { adjustToResizing(label); });
        }
      }
      return this.each(function() {
        var $this = $(this);

        if( $this.is(':visible') ) {

          if( $this.data('placeholder') ) {
            var $ol = $this.data('placeholder');
            $ol.css(calcPositionCss($this));
            return true;
          }

          var possible_line_height = {};
          if( !$this.is('textarea') && $this.css('height') != 'auto') {
            possible_line_height = { lineHeight: $this.css('height'), whiteSpace: 'nowrap' };
          }

          var isBorderBox = ($this.css('box-sizing') === 'border-box');
          var isTextarea = $this.is('textarea');

          var ol = $('<label />')
            .text($this.attr('placeholder'))
            .addClass(config.cls)
            .css($.extend({
              position:'absolute',
              display: 'inline',
              'float':'none',
              overflow:'hidden',
              textAlign: 'left',
              color: config.color,
              cursor: 'text',
              paddingTop: !isTextarea && isBorderBox ? '0' : $this.css('padding-top'),
              paddingRight: $this.css('padding-right'),
              paddingBottom: !isTextarea && isBorderBox ? '0' : $this.css('padding-bottom'),
              paddingLeft: $this.css('padding-left'),
              fontSize: $this.css('font-size'),
              fontFamily: $this.css('font-family'),
              fontStyle: $this.css('font-style'),
              fontWeight: $this.css('font-weight'),
              textTransform: $this.css('text-transform'),
              backgroundColor: 'transparent',
              zIndex: 99,
            }, possible_line_height))
            .css(calcPositionCss(this))
            .attr('for', this.id)
            .data('target',$this)
            .click(function(){
                if (!$(this).data('target').is(':disabled')) {
                    $(this).data('target').focus();
                }
            })
            .insertBefore(this);
            $this
                .data('placeholder', ol)
                .on('keydown', function () {
                    ol.hide();
                })
                .on('blur change', function () {
                    ol[$this.val().length ? 'hide' : 'show']();
                })
                .triggerHandler('blur');
          $(window).one("resize", function () { adjustToResizing(ol); });
        }
      });
    }
  });
})(jQuery);

jQuery(document).add(window).bind('ready load', function() {
  if (jQuery.placeholder) {
    jQuery.placeholder.shim();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<form name="providerSearch" ng-submit="SearchProvider(searchParam);" novalidate role="form">
   <div class="form-group"><input class="form-control" id="physiciansfirstname" ng-model="searchParam.FirstName" placeholder="First name:" type="text" /></div>

   <div class="form-group"><input class="form-control" id="physicianslastname" ng-model="searchParam.LastName" placeholder="Last name:" type="text" /></div>

   <!---<div class="form-group">
    <select class="form-control" id="providerSpecialty" ng-model="searchParam.Specialty">
     <option disabled="disabled" selected="selected" value="">Specialty</option>--->
     <!---<option disabled="disabledvalue=""></option>---><!---<option>Family practice</option><option>General practice</option><option>Internal medicine</option><option>Pediatrics</option>
    </select>--->
    <div class="form-group">
    <select class="form-control" id="providerSpecialty" ng-model="searchParam.Specialty">
     <option selected="selected" value="">Specialty</option>
          <!---<option value=""></option>--->
        <cfoutput query="SpFind">
                           <option value=#ProviderSpecialty#>#ProviderSpecialty#</option>
      </cfoutput> 
       </select>
       
   </div>

   <div class="form-group">
    <select class="form-control" id="city" ng-model="searchParam.City">
     <option selected="selected" value="">City</option>
          <!---<option value=""></option>--->
        <cfoutput query="cityFind">
                           <option value=#city#>#city#</option>
         
         <!---<option ng-selected="{{searchParam.City==#city#?true:false}} value=#city#>#city#</option>--->
      </cfoutput> 
       </select>
                      
            <!---<select class="form-control" id="city" ng-model="searchParam.City"><option disabled="disabled" selected="selected" value="">City</option><option ng-repeat="c in Cities" value="{{c.City}}">{{c.City}}</option> </select>--->
            </div>
   <div class="row">
    <!---<div class="col-xs-6 no-right-padding paddingLanguage">
     <div class="form-group widthLanguage">
              
                      
                    <select id="language" name="language" class="form-control" ng-model="searchParam.Language">
         <option disabled="disabled" selected="selected" value="">Language</option>
                        <!---<option value=""></option>--->
      <cfoutput query="Languages">
        <option value=#Language#>#Language#</option>
      </cfoutput> 
       </select>
                      
                      
                      
       <!---<select name="language" class="form-control widthLanguage" id="language" ng-model="searchParam.Language">
         <option disabled="disabled" selected="selected" value="">Language</option>
         <option ng-repeat="l in Languages">{{l.Lang}}</option>
          </select>--->
     </div>
    </div>--->

    <div class="col-xs-6 no-left-padding">
     <div class="form-group"><select class="form-control" id="gender" name="gender" ng-model="searchParam.Gender">
                    <option disabled="disabled" selected="selected" value="">Gender</option>
                    <!---<option value=""></option>--->
                    <option>Male</option><option>Female</option> </select></div>
    </div>
   </div>
            
            <hr class="hrDoctor" />
   <div style="margin-top:-10px; margin-bottom:10px; text-align:center; font-size:8pt! important">* or Search by Zip code radius *</div>
            
   <div class="row">
    <div class="col-xs-7 no-right-padding">
     <div class="form-group">
      <div class="input-group">
       <select class="form-control" id="miles" name="distance" ng-model="searchParam.Distance">
        <option value={{v.value}} ng-repeat="(k , v) in miles track by $index">{{v.value}}</option>
        <!---<option selected="disabled" value=""></option>
        <option selected="selected" value="5">5</option>
        <option selected="selected" value="10">10</option>
        <option selected="selected" value="15">15</option>
        <option selected="selected" value="20">20</option>---> 
       </select>
       <div class="input-group-addon">mi</div>
      </div>
     </div>
    </div>

    <div class="col-xs-5 no-left-padding widthZip">
      <div class="form-group">
     <input allow-pattern="[\d\W]" class="form-control" id="zip" maxlength="5" ng-model="searchParam.Zip" placeholder="Zip code" type="text" />
      </div>
    </div>
   </div>

   <div class="form-group">
    <input class="btn btn-warning btn-block" onclick="return checkTextField(); overlayDisplayButton();" ng-click="gotoElement('SearchResultsAnchor');" type="submit" value="Search" />
   </div>
  </form>