2016-04-22 4 views
4

Это мой 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 дней '' для раскрывающегося списка.

ответ

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, как это в основном предназначен, чтобы помочь Угловая внутри сортировки массива - и это то, что вызывает у вас проблемы, как вы используете объект, а не массив ,

Я также установил значение по умолчанию в шаблоне HTML, но это также можно сделать в вашем контроллере, это просто вопрос предпочтения.

+0

благодаря @Cosmin Ababei –

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> 

Использование ng-init в вашем HTML select тега, будет установлен параметр по умолчанию

UPDATE

Я сделал пример в plnkr. Проверьте это: plunker

+0

спасибо, что ответили, но он не работает –

+0

, а затем замените ключ [2] на правильное значение. он будет работать на 100%. вам просто нужно установить правильное значение в 'ng-init' – dpaul1994

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

+0

Вам не нужно изменять это в строке .. вы можете сделать это просто с индексом :) Я не говорю, что это плохой подход, но не самый лучший – dpaul1994

+0

Покажите в своем ответе, как это сделать с индексом? Более того, ваш 'plnkr' не работает. И не устанавливает значение по умолчанию :) –

+0

Ok. Может быть, это не самое лучшее. Что лучше тогда? –

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> 

Надеется, что это решит вашу проблему!

2

Я попробовал это, это также работает

Живой пример на 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)' }; 

I файл 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> 

там без настройки наша строка

Смежные вопросы