设置下拉列表的默认值

时间:2016-04-22 10:45:20

标签: angularjs

这是我的Java脚本代码

$scope.dateSelection = { 1: 'Today' , 2: 'Yesterday' ,3: 'Last 7 days', 4: 'Last business week (Mon - Fri)' ,   5: 'Last week (Sun - Sat)' , 6: 'This month' ,  7: 'Last month' , 8: 'All time' , 9: 'CUSTOM_DATE',10: 'This week (Sun - Today)',11: 'This week (Mon - Today)' , 12: 'Last week (Sun - Sat)' };

这是我的HTML代码

<select ng-options="key as value for (key,value) in dateSelection track by key" ng-change="getPerformanceData(indexValue)" ng-model="indexValue" >
            </select>

我想设置默认值为&#34; 3:&#39;过去7天&#39;&#34;下拉列表。

5 个答案:

答案 0 :(得分:2)

如果您可以自定义对象,则密钥为string,然后您可以通过在控制器中设置值进行初始化。

jsfiddle上的实例。

angular.module('ExampleApp', [])
  .controller('ExampleController', function($scope) {
    $scope.indexValue = "2";
    $scope.dateSelection = {
      1: 'Today',
      "2": 'Yesterday',
      "3": 'Last 7 days',
      4: 'Last business week (Mon - Fri)',
      5: 'Last week (Sun - Sat)',
      6: 'This month',
      7: 'Last month',
      8: 'All time',
      9: 'CUSTOM_DATE',
      10: 'This week (Sun - Today)',
      11: 'This week (Mon - Today)',
      12: 'Last week (Sun - Sat)'
    };
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="ExampleApp">
  <div ng-controller="ExampleController">

    <select ng-options="key as value for (key,value) in dateSelection" ng-model="indexValue">
    </select>
    {{indexValue}}

  </div>
</div>

答案 1 :(得分:2)

我试过这个,这也有效

JsFiddle

上的实例
import java.util.regex.Pattern;
import java.util.regex.Matcher;
class Module1{
  public static void main(String[] asd){
  String sourcestring = "source string to match with pattern";
  Pattern re = Pattern.compile("^(?=(?:[-+*/^]?[-+]?\\d+(?:[.]\\d+)?)*$)([-+]?[0-9.]+$|[-+]?[0-9.]+(?:[-+*/^][-+]?[0-9.]+)*(?=[-+*/^]))(?:([-+*/^])([-+]?[0-9.]+))?$",Pattern.CASE_INSENSITIVE);
  Matcher m = re.matcher(sourcestring);
  int mIdx = 0;
    while (m.find()){
      for( int groupIdx = 0; groupIdx < m.groupCount()+1; groupIdx++ ){
        System.out.println( "[" + mIdx + "][" + groupIdx + "] = " + m.group(groupIdx));
      }
      mIdx++;
    }
  }
}

我是html文件

$scope.indexValue = "3";
    $scope.dateSelection = { 1: 'Today', 
 2: 'Yesterday', 
 3: 'Last 7 days',
 4: 'Last business week (Mon - Fri)',
 5: 'Last week (Sun - Sat)',
 6: 'This month',
 7: 'Last month',
 8: 'All time', 
 9: 'CUSTOM_DATE', 
 10: 'This week (Sun - Today)', 
 11: 'This week (Mon - Today)',
 12: 'Last week (Sun - Sat)' };

在那里没有自定义我们的字符串

答案 2 :(得分:1)

只需更改HTML模板即可达到预期效果。

<select 
    ng-init="indexValue = '3'"
    ng-options="key as value for (key,value) in dateSelection" 
    ng-model="indexValue" 
    ng-change="getPerformanceData(indexValue)">
</select>

您已经注意到我已删除了track by表达式,因为它主要是为了帮助Angular在内部进行数组排序 - 这就是导致您出现问题的原因#&# 39;重新使用对象而不是数组。

我还在HTML模板中设置了默认值,但这也可以在您的控制器中完成,这只是一个偏好问题。

答案 3 :(得分:0)

试试这样:

<select ng-options="key as value for (key,value) in dateSelection track by key" ng-init="key[2]" ng-change="getPerformanceData(indexValue)" ng-model="indexValue" >
            </select>

在html ng-init标记中使用select,将设置默认选项

更新

我在plnkr中做了一个例子。检查一下:plunker

答案 4 :(得分:0)

请参阅以下示例:

<html>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl"> 
    <select ng-model="person">
        <option ng-repeat="x in people">{{x.name}}</option>
    </select>
    <script>
        //Module declaration
        var app = angular.module('myApp',[]);
        //controller declaration
        app.controller('myCtrl', function($scope){
            $scope.people = [{name:"Peter"},{name:"Julie"},{name:"Roger"}]; 
            $scope.person = "Julie";
        });
    </script>
</body> 
</html>

希望它能解决你的问题!