<!DOCTYPE html>
<html ng-app="angularjs-starter">
<head lang="en">
<meta charset="utf-8">
<title>ngRepeat bug</title>
<script src="//github.com/diseaz/angular.js/raw/2255817220ed6a6fe62b9578300ba9009ebe464f/angular.js"></script>
<link rel="stylesheet" href="style.css">
<script>
document.write('<base href="' + document.location + '" />');
</script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
AngularJS commit: <a href="https://github.com/petebacondarwin/angular.js/commit/63855aa75fcd09d802a1a6edeb5eff08cd31aa20
">here</a>
<h2>Array</h2>
<table>
<thead>
<tr>
<th></th>
<th>$index</th>
<th>Key</th>
<th>Value</th>
<th>[$index]</th>
<th>[key]</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(key, value) in testList">
<td>
<a ng-click="RemoveFromList($index)">Remove($index)</a>
<a ng-click="RemoveFromList(key)">Remove(key)</a>
</td>
<td>{{$index}}</td>
<td>{{key}}</td>
<td>{{value[0]}}</td>
<td>{{testList[$index][0]}}</td>
<td>{{testList[key][0]}}</td>
</tr>
</tbody>
</table>
<form>
<input type="text" placeholder="Value" ng-model="testListValue"/>
<button ng-click="AppendToList()">Append</button>
</form>
<h2>Object</h2>
<table>
<thead>
<tr>
<th></th>
<th>$index</th>
<th>Key</th>
<th>Value</th>
<th>[$index]</th>
<th>[key]</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(key, value) in testDict">
<td>
<a ng-click="RemoveFromDict(key)">Remove(key)</a>
</td>
<td>{{$index}}</td>
<td>{{key}}</td>
<td>{{value[0]}}</td>
<td>{{testDict[$index][0]}}</td>
<td>{{testDict[key][0]}}</td>
</tr>
</tbody>
</table>
<form>
<input type="text" placeholder="Value" ng-model="testDictValue"/>
<button ng-click="AppendToDict()">Append</button>
</form>
</body>
</html>
var app = angular.module('angularjs-starter', []);
app.controller('MainCtrl', function($scope) {
$scope.testList = [
['A', 'A'],
['B', 'B'],
['C', 'C'],
['D', 'D'],
['E', 'E'],
['F', 'F'],
['G', 'G'],
['H', 'H']
];
$scope.testDict = {
'A': ['A', 'A'],
'B': ['B', 'B'],
'C': ['C', 'C'],
'D': ['D', 'D'],
'E': ['E', 'E'],
'F': ['F', 'F'],
'G': ['G', 'G'],
'H': ['H', 'H']
};
$scope.RemoveFromList = function(idx) {
$scope.testList.splice(idx, 1);
};
$scope.AppendToList = function() {
if ($scope.testListValue) {
$scope.testList.push([$scope.testListValue, $scope.testListValue]);
}
};
$scope.RemoveFromDict = function(idx) {
delete $scope.testDict[idx];
};
$scope.AppendToDict = function() {
if ($scope.testDictValue) {
$scope.testDict[$scope.testDictValue] = [$scope.testDictValue, $scope.testDictValue];
}
};
});
/* CSS goes here */