下拉选择值未设置并以角度js

时间:2017-05-01 07:28:18

标签: javascript angularjs

我正在使用angularJS处理C#/ MVC应用程序。我需要在弹出窗口中显示下拉列表,如果记录已经有值,则默认情况下应该选择该值,否则默认选项会选择一个选项。

我能够绑定下拉列表,如果我调试我得到了正确的ng-model值,但它显示为空白。

这是弹出窗口中的控制器代码点击

$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 > 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 });

}

html如下

<div class="form-group">
<label class="col-sm-3 control-label">Category</label>
<!--<div class="col-sm-9">
    <input type="text" name="category" class="form-control" ng-model="Popup.Category" />
</div>-->
<div class="col-sm-9">
    <select class="form-control" name="categoryDrp" ng-model="Popup.CategoryId">
        <option value="">-- choose an option --</option>
        <option ng-repeat="item in CategoryData" value="{{item.id}}">{{item.categoryName}}</option>
    </select>
</div>

现在如果我调试,我可以看到CategoryId设置正确的id。例如已经CategoryData但已显示“空白”的7或8或9如果Id可用,则作为第一个选项

如果CategoryId为null,则显示正确的'-- choose an option --'

1 个答案:

答案 0 :(得分:1)

尝试ng-selected="item.id == Popup.CategoryId"

<select class="form-control" name="categoryDrp" ng-model="Popup.CategoryId">
  <option value="">-- choose an option --</option>
  <option ng-repeat="item in CategoryData" value="{{item.id}}" 
          ng-selected="item.id == Popup.CategoryId">{{item.categoryName}}</option>
</select>