在選擇angularjs中選擇第一個選項

Question

我有一個小問題，我只需要選擇我的第一個元素，就目前而言，我只排第一行，

這是我的小代碼

 <select style="border-radius: 4px;" class="form-control" ng-model="select" ng-init="somethingHere = option[1]" id="sel1">
                 <option ng-repeat="option in dateHeureAdd track by option.value" value="{{option.value}}">{{option.heure}}</option>
             </select>

CTRL鍵

$scope.dateHeureAdd = [

    {value: '8', heure: '08:00'},
    {value: '9', heure: '09:00'},
    {value: '10', heure: '10:00'},
    {value: '11', heure: '11:00'},
    {value: '12', heure: '12:00'},
    {value: '13', heure: '13:00'},
    {value: '14', heure: '14:00'},
    {value: '15', heure: '15:00'},
    {value: '16', heure: '16:00'},
    {value: '17', heure: '17:00'}

                        ]

這是一個矮人

http://plnkr.co/edit/aDUGvrvJjszq07Sjh0TI?p=preview

謝謝你的幫助

Answer 1

選項有一個特殊的指令，稱為ng-options ，您也可以引用ng-module的名稱並將其設置為默認值。

這是有效的解決方案： http : //plnkr.co/edit/eHMoEqVxTv5QQh12FWv1?p=preview

Index.html：

<!doctype html>
<html ng-app="ui.bootstrap.demo">

<head>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-animate.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-sanitize.js"></script>
  <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-2.5.0.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script>

  <script src="script.js"></script>
  <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
  </br>
  <div ng-controller="Ctrl">
    <select class="form-control" ng-model="mySelect" ng-options="date as date.heure for date in dates track by date.value">

    </select>
  </div>
</body>

</html>

的script.js：

angular.module('ui.bootstrap.demo', ['ui.router','ngAnimate', 'ngSanitize', 'ui.bootstrap']);



angular.module('ui.bootstrap.demo', [])
  .controller('Ctrl',[ '$scope', function ($scope) {
  $scope.dates = [
    {value: '8', heure: '08:00'},
    {value: '9', heure: '09:00'},
    {value: '10', heure: '10:00'},
    {value: '11', heure: '11:00'},
    {value: '12', heure: '12:00'},
    {value: '13', heure: '13:00'},
    {value: '14', heure: '14:00'},
    {value: '15', heure: '15:00'},
    {value: '16', heure: '16:00'},
    {value: '17', heure: '17:00'}]

  $scope.mySelect = $scope.dates[0];
}]);

Answer 2

您初始化選擇值的表達是錯誤的； 您不應在ng-repeat中使用別名，而應使用原始數組的名稱。

 ng-init="somethingHere = option[1]"

至

  ng-init="somethingHere = dateHeureAdd[1].value"

同樣，您必須使用select的ng-model進行分配，這與您的情況有所不同。

更正的例子

在選擇angularjs中選擇第一個選項

問題描述

2 個解決方案

解決方案1
2 已采納 2017-04-16 00:15:00

解決方案2
1 2017-04-16 04:02:11

在選擇angularjs中選擇第一個選項

問題描述

2 個解決方案

解決方案1 2 已采納 2017-04-16 00:15:00

解決方案2 1 2017-04-16 04:02:11

解決方案1
2 已采納 2017-04-16 00:15:00

解決方案2
1 2017-04-16 04:02:11