Angular JS docs表示ngRepeat指令应该将$ index变量设置为数组中的项索引。这在Chrome和IE 10中运行良好,但IE 9显示“{{$ index}}”而不是数字。这是一个小例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Host Parameters</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
<style>
.host-param-table {
border-collapse: collapse;
}
.host-param-table td, .host-param-table th {
border: 1px solid gray;
text-align:center;
padding: 2px;
font-size: 15px;
font-family: Arial;
}
</style>
</head>
<body id="ng-app" data-ng-app>
<div data-ng-controller="HostParametersCtrl">
<table class="host-param-table">
<tr>
<th>Name</th>
<th>Index</th>
<th>On</th>
<th>Value (Hex)</th>
<th>Value (Output)</th>
</tr>
<tr data-ng-repeat="p in params">
<td>{{p.name}}</td>
<td>{{$index}}</td>
<td><input data-ng-model="p.isEnabled" type="checkbox" /></td>
<td><input data-ng-model="p.value" data-ng-disabled="!p.isEnabled" type="text" /></td>
<td>0x{{p.value}}</td>
</tr>
</table>
</div>
<script type="text/javascript">
function HostParametersCtrl($scope) {
$scope.params = [
{ 'isEnabled': false, 'name': 'First', 'value': '' },
{ 'isEnabled': false, 'name': 'Second', 'value': '' },
{ 'isEnabled': false, 'name': 'Third', 'value': '' },
{ 'isEnabled': false, 'name': 'Fourth', 'value': '' },
{ 'isEnabled': false, 'name': 'Fifth', 'value': '' },
{ 'isEnabled': false, 'name': 'Sixth', 'value': '' },
{ 'isEnabled': false, 'name': 'Seventh', 'value': '' }
];
}
</script>
</body>
</html>
在Chrome 29中查看:
在IE 9中查看:
请注意,复选框会按预期禁用输入。这只是指数被打破了。今天是我使用Angular JS的第一天,所以我希望有一些简单的事情我忘了,这是一个简单的解决方案。我做错了什么?
答案 0 :(得分:1)
我在这里用你的代码创建了一个plunkr:http://plnkr.co/edit/ajHZ04yqnBmKHUicWmgb?p=preview - 我修改了一下。
当我使用IE在我的本地PC上查看相同的代码库时,它在IE8,9和10中运行相同。它在IE7中根本不运行。
不幸的是,我不认为plunkr支持IE8或9,所以只需将代码粘贴到您的文件中,看看它是否有所作为。