如使用$ rootScope变量选定的角度NG-重复的选择，设置一个选项 [英] Angular ng-repeat for a select, setting one option as selected using $rootScope variable
本文介绍了如使用$ rootScope变量选定的角度NG-重复的选择，设置一个选项的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有以下选择：
＆LT;选择类=表格控
的onchange =User_Changed_Language（）
ID =HeaderLanguageSelection
风格=光标：指针;宽度：100％;高度：30PX;保证金：0;填充：0
标题={{Labels.Change_Language_Tooltip}}＆GT;
＆LT;选项NG重复=One_Language在Languages_List
值={{One_Language。code}}
NG-选择=One_Language code == CURRENT_LANGUAGE。＆GT;
{{One_Language.Name}}
＆LT; /选项＆GT;
＆LT; /选择＆GT;
现在， CURRENT_LANGUAGE 是一个值（例如EN）在 $ rootScope 变量。我要选择元素的第一个显示所选择的值代替。我在做什么错了？
还要说明一点：我知道，我可以用 NG-点击，但我不认为这是问题的根源。
感谢。
解决方案
勾选此片段：
\r
\r\r
\r VAR应用= angular.module（'应用'，[]）;\r
\r
app.controller（'MainCtrl'，函数（$范围，$ rootScope）{\r
\r
$ scope.Labels = {Change_Language_Tooltip：改变郎};\r
$ scope.Languages_List = [\r
{名称：'英语'，code：'恩'}，\r
{名称：'猎犬'，code：'上课'}，\r
{名称：'意大利'，code：'它'}];\r
$ rootScope.current_Language = $ scope.Languages_List [1];\r
\r
}）; \r
＆LT;！DOCTYPE HTML＆GT;\r
＆LT; HTML NG-应用=应用程序＆GT;\r
\r
＆LT; HEAD＆GT;\r
＆LT;间的charset =UTF-8/＆GT;\r
＆LT;脚本SRC =HTTPS：//$c$c.angularjs.org/1.3.15/angular.js＆GT;＆LT; / SCRIPT＆GT;\r
＆所述; SCRIPT SRC =app.js＆GT;＆下; /脚本＆GT;\r
＆LT; /头＆GT;\r
\r
＆LT;机身NG控制器=MainCtrl＆GT;\r
＆LT; P＆GT;选择产品：{{CURRENT_LANGUAGE}}＆LT; / P＆GT;\r
\r
＆LT;选择类=表格控\r
的onchange =User_Changed_Language（）\r
ID =HeaderLanguageSelection\r
风格=光标：指针;宽度：100％;高度：30PX;保证金：0;填充：0\r
标题={{Labels.Change_Language_Tooltip}}\r
NG-选项=item.name为项Languages_List轨道按项目。code\r
NG-模式=CURRENT_LANGUAGE＆GT;\r
＆LT; /选择＆GT;\r
\r
＆LT; /身体GT;\r
\r
＆LT; / HTML＆GT; \r
PS：所选择的项目（默认或初始）必须在ngOptions列表中使用的项中的一个元素
I have the following select:
<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>
Now, current_Language is a $rootScope variable with a value (e.g. "EN"). I want the select element to display the selected value instead of the very first. What am I doing wrong?
One more note: I know that I could use ng-click, but I don't think this is the source of the issue.
Thanks.
解决方案
Check this snippet:
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: the selected item (default or initial) must be one element of the items used in the ngOptions list
这篇关于如使用$ rootScope变量选定的角度NG-重复的选择，设置一个选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
