Угловое нг-повтора для выбора, установив один вариант, как выбрано с помощью $ rootScope переменную

я следующий выбор:

<select class="form-control" 
     onchange="User_Changed_Language()" 
     id="HeaderLanguageSelection" 
     style="cursor:pointer;width:100%;height:30px;margin:0;padding:0" 
     title="{{Labels.Change_Language_Tooltip}}"> 
    <option ng-repeat="One_Language in Languages_List" 
      value="{{One_Language.Code}}" 
      ng-selected="One_Language.Code == current_Language"> 
     {{One_Language.Name}} 
    </option> 
</select>

Теперь current_Language является $rootScope переменной со значением (например, «EN»). Я хочу, чтобы элемент select отображал выбранное значение, а не самое первое. Что я делаю не так?

Еще одно примечание: я знаю, что могу использовать ng-click, но я не думаю, что это источник проблемы.

Спасибо.

источник

2016-01-24 FDavidov

Использование 'ng- options' и 'ng-model' для создания параметров. Когда значение модели задано в контроллере, оно будет выбрано во время выполнения. Поскольку '$ scope' наследуется от' $ rootScope', он должен работать нормально, как только вы меняете разметку – charlietfl

ng-selected = "One_Language.Code == current_Language.Code". Просто проверяю. –

Я только что проверил документ ngoptions, и неясно, как установить условие наличия одной из записей SELECED на основе значения 'current_Language'. – FDavidov

Проверьте этот фрагмент:

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

 
app.controller('MainCtrl', function($scope, $rootScope) { 
 

 
    $scope.Labels = {Change_Language_Tooltip: "change lang"}; 
 
    $scope.Languages_List = [ 
 
    { name: 'English', Code: 'en' }, 
 
    { name: 'Espanol', Code: 'es' }, 
 
    { name: 'Italian', Code: 'it' }]; 
 
    $rootScope.current_Language = $scope.Languages_List[1]; 
 

 
});

<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <meta charset="utf-8" /> 
 
    <script src="https://code.angularjs.org/1.3.15/angular.js"></script> 
 
    <script src="app.js"></script> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <p>selected item is : {{current_Language}}</p> 
 

 
    <select class="form-control" 
 
    onchange="User_Changed_Language()" 
 
    id="HeaderLanguageSelection" 
 
    style="cursor:pointer;width:100%;height:30px;margin:0;padding:0" 
 
    title="{{Labels.Change_Language_Tooltip}}" 
 
    ng-options="item.name for item in Languages_List track by item.Code" 
 
    ng-model="current_Language"> 
 
    </select> 
 

 
</body> 
 

 
</html>

PS: выбранный элемент (по умолчанию или начальное) должен быть один элемент из элементов, используемых в списке ngOptions

источник

2016-01-24 17:26:32 beaver

Ницца !!!!! Спасибо за решение. Один комментарий/вопрос: Должен ли я предположить, что если мы хотим иметь два поля, показанные в списке (например, английское имя + имя родного языка, например 'Spanish (Español)', мы могли бы просто написать «ng-options =» item.name (item.Native) для элемента в треке Languages_List по элементу. Код "'? – FDavidov

вы должны написать 'ng-options =" item.name + '(' + item.native + ')' для элемента в треке Languages_List по item.code " '(проверить https://docs.angularjs.org/api/ng/directive/ngOptions).« Метка »части выражения« comprehension_expression »является выражением Angular. – beaver

ОК. Спасибо. Не всегда ясно, как вставлять данные в пределах директив/механизмов Angular. – FDavidov

Угловое нг-повтора для выбора, установив один вариант, как выбрано с помощью $ rootScope переменную

ответ

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