Need ID of SELECT in ngRepeat but get "Syntax Error: Token '{' invalid key at column ## ""
Need ID of SELECT in ngRepeat but get "Syntax Error: Token '{' invalid key at column ## ""
我正在使用 ng-repeat 生成一组选择。它的工作原理,主要是。
现在我正在尝试设置 ngMessages 以显示检查重复选择的自定义指令的错误,并将 SELECT 设置为无效。
但是,ngMessages 指令属性不喜欢 Form1.Select_{{$index}} 语法。这应该解析为 Form1.SELECT_0 等。注意,这个 sytnax 在 ng-show 属性中工作。我如何让它为 ngMessages 工作?我需要将 ngMessages 设置为元素 $error 数组。
<span class="error" style="color:red" ng-show="Form1.Select_{{$index}}.$touched" ng-messages="Form1.Select_{{$index}}.$error" >
<span ng-message="required">select an option</span>
<span ng-messages-include='errormessages.html'> </span>
</span>
您不能在 angular 表达式(例如,ng-show 或 ng-messages 属性值)中使用插值 ({{ }}
)。
这里有一个完整的例子,可以做你想做的事:
<!DOCTYPE html>
<html ng-app="app">
<head>
<script data-require="angular.js@1.5.3" data-semver="1.5.3" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-messages.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<form name="form1">
<div ng-repeat="a in ['a', 'b', 'c'] track by $index">
<select name="selects_{{ $index }}" ng-model="selections[$index]" required>
<option value=""></option>
<option value="1">1</option>
<option value="2">1</option>
<option value="3">1</option>
</select>
{{ selections[$index] }}
<span class="error" style="color:red" ng-show="form1['selects_' + $index].$touched" ng-messages="form1['selects_' + $index].$error">
<span ng-message="required">select an option</span>
</span>
</div>
</form>
</body>
</html>
我正在使用 ng-repeat 生成一组选择。它的工作原理,主要是。
现在我正在尝试设置 ngMessages 以显示检查重复选择的自定义指令的错误,并将 SELECT 设置为无效。
但是,ngMessages 指令属性不喜欢 Form1.Select_{{$index}} 语法。这应该解析为 Form1.SELECT_0 等。注意,这个 sytnax 在 ng-show 属性中工作。我如何让它为 ngMessages 工作?我需要将 ngMessages 设置为元素 $error 数组。
<span class="error" style="color:red" ng-show="Form1.Select_{{$index}}.$touched" ng-messages="Form1.Select_{{$index}}.$error" >
<span ng-message="required">select an option</span>
<span ng-messages-include='errormessages.html'> </span>
</span>
您不能在 angular 表达式(例如,ng-show 或 ng-messages 属性值)中使用插值 ({{ }}
)。
这里有一个完整的例子,可以做你想做的事:
<!DOCTYPE html>
<html ng-app="app">
<head>
<script data-require="angular.js@1.5.3" data-semver="1.5.3" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-messages.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<form name="form1">
<div ng-repeat="a in ['a', 'b', 'c'] track by $index">
<select name="selects_{{ $index }}" ng-model="selections[$index]" required>
<option value=""></option>
<option value="1">1</option>
<option value="2">1</option>
<option value="3">1</option>
</select>
{{ selections[$index] }}
<span class="error" style="color:red" ng-show="form1['selects_' + $index].$touched" ng-messages="form1['selects_' + $index].$error">
<span ng-message="required">select an option</span>
</span>
</div>
</form>
</body>
</html>