Miuler/jsbin.eJOVofO.coffee

## jsbin.eJOVofO.coffee
class TodoCtrl
    constructor: ($scope) ->
        $scope.todos = [
            text: "learn angular"
            done: true
        ,
            text: "build an angular app"
            done: false
        ]

        $scope.addTodo = ->
            $scope.todos.push({ text: $scope.todoText, done: false })
            $scope.todoText = ""

        $scope.remaining = ->
            count = 0
            angular.forEach($scope.todos, (todo) ->
                count += if todo.done then 0 else 1
            )
            count

        $scope.archive = ->
            oldTodos = $scope.todos
            $scope.todos = []
            angular.forEach(oldTodos, (todo) ->
                $scope.todos.push(todo) unless todo.done
            )

angular.module("todoApp", [])
    .controller("TodoCtrl", TodoCtrl)

## jsbin.eJOVofO.css
.done-true {
    text-decoration: line-through;
    color: grey;
}

## jsbin.eJOVofO.html
<!DOCTYPE html>
<html ng-app="todoApp">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>
    <h2>Todo</h2>
    <div ng-controller="TodoCtrl">
        <span>{{remaining()}} of {{todos.length}} remaining</span>
        [ <a href="" ng-click="archive()">archive</a> ]
        <ul class="unstyled">
            <li ng-repeat="todo in todos">
                <input type="checkbox" ng-model="todo.done">
                <span class="done-{{todo.done}}">{{todo.text}}</span>
            </li>
        </ul>
        <form ng-submit="addTodo()">
            <input type="text" ng-model="todoText" size="30"
                placeholder="add new todo here">
            <input class="btn-primary" type="submit" value="add">
        </form>
    </div>
</body>
</html>
	class TodoCtrl
	constructor: ($scope) ->
	$scope.todos = [
	text: "learn angular"
	done: true
	,
	text: "build an angular app"
	done: false
	]

	$scope.addTodo = ->
	$scope.todos.push({ text: $scope.todoText, done: false })
	$scope.todoText = ""

	$scope.remaining = ->
	count = 0
	angular.forEach($scope.todos, (todo) ->
	count += if todo.done then 0 else 1
	)
	count

	$scope.archive = ->
	oldTodos = $scope.todos
	$scope.todos = []
	angular.forEach(oldTodos, (todo) ->
	$scope.todos.push(todo) unless todo.done
	)

	angular.module("todoApp", [])
	.controller("TodoCtrl", TodoCtrl)
	<!DOCTYPE html>
	<html ng-app="todoApp">
	<head>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
	</head>
	<body>
	<h2>Todo</h2>
	<div ng-controller="TodoCtrl">
	<span>{{remaining()}} of {{todos.length}} remaining</span>
	[ <a href="" ng-click="archive()">archive</a> ]
	<ul class="unstyled">
	<li ng-repeat="todo in todos">
	<input type="checkbox" ng-model="todo.done">
	<span class="done-{{todo.done}}">{{todo.text}}</span>
	</li>
	</ul>
	<form ng-submit="addTodo()">
	<input type="text" ng-model="todoText" size="30"
	placeholder="add new todo here">
	<input class="btn-primary" type="submit" value="add">
	</form>
	</div>
	</body>
	</html>