title: dropdown selected value not setting and displaying blank text in angular js
body: <p>I am working on C#/MVC application with angularJS. I need to display dropdown on popup, If record already have value then by default that value should be selected otherwise default option choose an option.</p>
  
  <p>I am able to bind dropdown and If I debug I am getting correct ng-model value but its displaying blank.</p>
  
  <p>Here is controller code on pop up open click</p>
  
  <pre><code>$scope.ShowAdPopup = function (adId) {
  
    $scope.Popup.CategoryId = 0;
    $scope.Popup.InterestId = 0;
    $scope.Popup.SourceId = 0;
  
    var filteredData = $filter('filter')($scope.gridAdData, { id: adId }, true);
  
    if (filteredData.length &gt; 0) {
       $scope.Popup.Id = filteredData[0].id;
       $scope.Popup.AdId = filteredData[0].adId;
       $scope.Popup.AdName = filteredData[0].adName;
       $scope.Popup.Category = filteredData[0].category;
       $scope.Popup.Interest = filteredData[0].interest;
       $scope.Popup.Source = filteredData[0].source;
       $scope.Popup.AdUrl = filteredData[0].adUrl;
       $scope.Popup.CategoryId = filteredData[0].categoryId;
       $scope.Popup.InterestId = filteredData[0].interestId;
       $scope.Popup.SourceId = filteredData[0].sourceId;
   }
   $("#divAddGroup").modal({ show: true, backdrop: 'static', keyboard: false });
  
  }
  </code></pre>
  
  <p>And html is as below</p>
  
  <pre><code>&lt;div class="form-group"&gt;
  &lt;label class="col-sm-3 control-label"&gt;Category&lt;/label&gt;
  &lt;!--&lt;div class="col-sm-9"&gt;
      &lt;input type="text" name="category" class="form-control" ng-model="Popup.Category" /&gt;
  &lt;/div&gt;--&gt;
  &lt;div class="col-sm-9"&gt;
      &lt;select class="form-control" name="categoryDrp" ng-model="Popup.CategoryId"&gt;
          &lt;option value=""&gt;-- choose an option --&lt;/option&gt;
          &lt;option ng-repeat="item in CategoryData" value="{{item.id}}"&gt;{{item.categoryName}}&lt;/option&gt;
      &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>Now If I debug and I can see CategoryId setting correct id . e.g. 7 or 8 or 9 which <code>CategoryData</code> have already but its display 'blank' as first option if Id is available</p>
  
  <p>If CategoryId is null then it display <code>'-- choose an option --'</code>  which is correct</p>