样本

Question

我已经阅读了几个关于这个问题的帖子，这个网站上给出的解决方案对我来说似乎不起作用。我有一个包含多个选项的选择框，我需要向用户显示一个默认值。目前没有选择任何选项。这段代码可能有什么问题。

HTML

<select class="form-control input-sm" name="collegeTranscripts1" id="collegeTranscripts1" data-ng-  model='transcriptCAdata.typeAccepted' data-ng-options='option.value as option.name for option in typeOptions1'></select>

JS

$scope.typeOptions1 = [
            { name: 'Please Select', value: 'selected' },
            { name: 'Official', value: 'OFFICIAL' },
            { name: 'Unofficial', value: 'UNOFFICIAL' },
            { name: 'None', value: 'NONE' }
        ];

        $scope.form = {type : $scope.typeOptions1[0].value};

Answer 1

我在您的代码中看到了一些问题：

HTML属性data-ng-model是分开的，如下所示：data-ng- model='transcriptCAdata.typeAccepted'。
另一个原因是在您的模型中，您使用的是范围属性transcriptCAdata.typeAccepted，但您没有在控制器中声明它。我在你的控制器中看到的是$scope.form = {type : $scope.typeOptions1[0].value};。

您只需将data-ng-model更改为data-ng-model="form.type"。

样本

＆＃13;

angular.module('app', [])

  .controller('Ctrl', function($scope) {
    $scope.typeOptions1 = [
            { name: 'Please Select', value: 'selected' },
            { name: 'Official', value: 'OFFICIAL' },
            { name: 'Unofficial', value: 'UNOFFICIAL' },
            { name: 'None', value: 'NONE' }
        ];

    $scope.form = {type : $scope.typeOptions1[1].value};
  });

＆＃13;

<div ng-app="app" ng-controller="Ctrl">
  <select class="form-control input-sm" name="collegeTranscripts1"
          id="collegeTranscripts1" data-ng-model='form.type' 
          data-ng-options='option.value as option.name for option in typeOptions1'>
  </select>
  
  {{form.type}}
</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

＆＃13;

更新：

我复制了您提供的 PLUNKER 并对其进行了修改，因为它存在问题。

使用AngularJS在选择框选项上选择默认值

1 个答案:

样本

更新：