Question

我的HTML文件中有以下Angular代码。我有一个下拉框，其中包含两个固定选项：A和B。用户必须选择A或B。它不能留空。我希望默认选择为A。我该怎么办？

以下代码以一个空的下拉框开始。我不希望这样。我希望预先选择A。

<div ng-controller="MyController as myCtrl">
  <select ng-model="myCtrl.param1">
    <option value="a" selected>A</option>
    <option value="b">B</option>
  </select><br/>
  <button ng-click="myCtrl.submit()">submit</button>
</div>

Answer 1

您可以按如下方式在控制器中声明变量：

$scope.myCtrl.param1 = 'A';

工作小提琴：https://jsfiddle.net/n9tL7cdr/2/

Answer 2

您需要使用ng-selected和基于键，您可以保留选定的项目，例如

＆＃13;

<md-select ng-model="sms.from" ng-change="getSelectedValue(sms.from, 'from')">
  <md-option ng-repeat="(i,item) in fromNumber" ng-value="item" ng-selected="i == 0 ? true:false">{{ item }}</md-option>
</md-select>

＆＃13;

Answer 3

以下说明了人们可以采用的方式：

选项1：（通过添加ng-selected="true"）

HTML：

<div ng-app="app" ng-controller="MyController as myCtrl">
    <select ng-model="myCtrl.param1">
        <option value="a" ng-selected="true">A</option>
        <option value="b">B</option>
    </select><br />
    <button ng-click="myCtrl.submit()">submit</button>
</div>

JS：

var app = angular.module('app', []);

app.controller('MyController', function ($scope) {
    var myCtrl = this;
    myCtrl.submit = function () {
       /*..*/
    }

    $scope = myCtrl;
});

选项2：（通过设置variable中的controller）

HTML：

<div ng-app="app" ng-controller="MyController as myCtrl">
    <select ng-model="myCtrl.param1">
        <option value="a">A</option>
        <option value="b">B</option>
    </select><br />
    <button ng-click="myCtrl.submit()">submit</button>
</div>

JS：

var app = angular.module('app', []);

app.controller('MyController', function ($scope) {
    var myCtrl = this;
    myCtrl.submit = function () {

    }
    myCtrl.param1 = "a";

    $scope = myCtrl;
});

如果您不想预先选择任何，但显示标签，那么 - ＆gt;

选项3：（仅显示“选择”标签 - 在这种情况下不预先选择）

HTML：

<div ng-app="app" ng-controller="MyController as myCtrl">
    <select ng-model="myCtrl.param1">
        <option value="">Select</option>
        <option value="a">A</option>
        <option value="b">B</option>
    </select><br />
    <button ng-click="myCtrl.submit()">submit</button>
</div>

JS：

var app = angular.module('app', []);

app.controller('MyController', function ($scope) {
    var myCtrl = this;
    myCtrl.submit = function () {

    }
    $scope = myCtrl;
});

如何从AngularJS的下拉框中设置选择默认值？

3 个答案: