设置默认值下拉

这是我的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>

我想设置一个默认值是“3：“最近7天'“作为下拉菜单。

来源

2016-04-22 mitra p

您也可以活生生的例子只是通过改变达到预期的效果模板。

<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表达，因为它的主要目的是帮助在内部与数组排序的角度 - 这是因为你使用的是对象，而不是一个数组是什么导致你的问题。

我也设置在HTML模板中的默认值，但也可以在你的控制器完成的，它只是一个偏好的问题。

来源

2016-08-30 04:58:17

谢谢@Cosmin Ababei –

尝试这样的：

<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标签select使用ng-init，将设置一个默认选项

UPDATE

我plnkr做出了表率。检查此：plunker

来源

2016-04-22 10:46:53 dpaul1994

感谢您给予回复，但它不起作用 –

然后用您的正确值替换关键[2]。它将工作100％。你只需要在'ng-init'中设置正确的值。 – dpaul1994

其实我试图给出错误 –

如果您可以自定义您的对象的键将是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>

来源

2016-04-22 12:42:15

你不必改变它在字符串..你可以简单地用索引:)我不是说这个是一个坏方法，但不是最好的 – dpaul1994

在你的答案中显示如何使用索引做到这一点？而且，你的'plnkr'不起作用。并没有设置默认值:) –

好的。也许不是最好的。什么是最好的呢？ –

请看下面的例子：

<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>

希望它可以解决您的问题！

来源

2016-04-22 13:16:16 Deadpool

我想这一点，这也是工作

上JsFiddle

$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)' };

我的HTML文件

<select class="form-control" ng-model="indexValue" ng-change="getPerformanceData(indexValue)"> 
       <option ng-repeat="(key, value) in dateSelection track by key" ng-selected="{{key == indexValue}}" value="{{key}}">{{value}}</option> 
      </select>

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

来源

2016-04-25 05:18:14

设置默认值下拉

回答

相关问题