3
我也跟着角JS TODO例如並張貼我的代碼上的jsfiddle（與AngularJS V1.0.3）： http://jsfiddle.net/7w689/如何讓IE9中的AngularJS TODO例子與IE8，Chrome，Firefox一樣工作？
我想不通爲什麼預期不會在IE9工作。 它可以在IE8，Chrome和Firefox中使用，但在IE9中具有不同的行爲，如下所述。
在IE8，Chrome和Firefox觀察到的行爲： 當頁面加載第一次點擊的TODO列表中的任何TODO複選框將修改CSS類TODO項目（.done真與.done假）和將更新「剩餘待辦事項」號碼。
觀察到的行爲在IE9： 當頁面加載第一次點擊的TODO列表中的任何TODO複選框不會修改CSS類TODO項目（.done真與.done假），並不會更新「剩餘待辦事項」號碼。 只有在列表中的每個項目被選中並取消選中幾次之後，它纔會開始工作。 不清楚爲什麼會發生這種情況，以及如何使它在IE9中的行爲與在IE8和其他瀏覽器中的行爲相同。
通過在IE9中使用開發工具並選擇瀏覽器模式：IE9，文檔模式：IE9標準（與文檔模式：IE8標準相比），可以重現此行爲。
HTML：
<div ng-app>
<div ng-controller="TodoCtrl">
<span>Total number of todos: {{todos.length}}</span><br />
<span>Remaining todos: {{(todos | filter: {done: false}).length}}</span><br />
<ul>
<li ng-repeat="todo in todos">
<input type="checkbox" ng-model="todo.done" id="chk{{$index}}"/>
<label for="chk{{$index}}" ng-class="{'done-true': todo.done, 'done-false': !todo.done}">
{{todo.text}} | {{todo.done}}
</label>
</li>
</ul>
<form>
<input type="text" ng-model="todoText"
size="30" placeholder="add new todo here"/>
<button ng-click="addTodo()">Add</button>
</form>
</div>
</div>
JS：
function TodoCtrl($scope) {
$scope.todos = [
{ text: 'task 1', done: true },
{ text: 'task 2', done: false }
];
$scope.addTodo = function()
{
$scope.todos.push({ text: $scope.todoText, done: false });
$scope.todoText = "";
};
}
CSS：
.done-true {text-decoration: line-through; color: grey;}
.done-false {text-decoration: none; color: red;}