Angular js ng-options选择空白标签。当我选择它不显示选择

时间:2018-09-24 06:48:58

标签: angularjs ng-options

当我从下拉列表中进行选择时,它将绑定到模型中,但是选择的标签显示为空白。

<select class="form-control" ng-options="data as data.field for data in reportAnalysis.categoryFields track by data.id" ng-model="reportAnalysis.testData"> 
    <option value="" selected disabled>---Select---</option>    
</select>

任何解决方案请帮忙吗?

2 个答案:

答案 0 :(得分:0)

根据您提到的数据,您的选择语句应为 categoryFields.response 。不知道您是否已将categoryFields设置为直接保存响应对象。同样,您共享的数据也有方括号和花括号,这是错别字。您可以检查工作中的jsfiddle链接以了解更多信息

 <select class="form-control" ng-options="data as data.field for data in reportAnalysis.categoryFields.response track by data.id" ng-model="reportAnalysis.testData"> 
 <option value="" selected disabled>---Select---</option>    
 </select> 

jsfiddle:https://jsfiddle.net/caq0ne1d/27/

让我知道这是否有帮助。

答案 1 :(得分:0)

var app = angular.module("Profile", [])
app.controller("ProfileCtrl", function($scope) {
  $scope.reportAnalysis = {}
  $scope.reportAnalysis['categoryFields'] = [{
    "id": 178,
    "field": "Attachments",
    "sort_order": 1,
    "field_type": [{
      "id": 178,
      "type": 5,
      "is_mandatory": 0,
      "conditional_field_id": 0,
      "conditional_field_value": ""
    }]
  }]
  $scope.reportAnalysis['testData'] = {}
  $scope.update_data = function() {
    console.log($scope.reportAnalysis['testData'])
  }

})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="Profile" ng-controller="ProfileCtrl">
  <select class="form-control" ng-options="data as data.field for data in reportAnalysis.categoryFields track by data.id" ng-model="reportAnalysis.testData" ng-change="update_data()">
    <option value="" selected disabled>---Select---</option>
  </select>
</body>