var app = angular.module('app', []);
app.controller('MainCtrl', function($scope) {
$scope.lista = [
{nome: 'tadeu'}
, {nome: 'luiz'}
];
$scope.add = function() {
$scope.lista.push({nome: $scope.nome});
$scope.nome = "";
}
});
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link href="style.css" rel="stylesheet" />
<script data-semver="1.2.16" src="https://code.angularjs.org/1.2.16/angular.js" data-require="angular.js@1.2.x"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<h1>Hi</h1>
<label>Nome:</label>
<input type="text" ng-model="nome"/>
<button ng-click="add()">add</button>
<hr>
<div>
<ul>
<li ng-repeat="item in lista">
<input type="checkbox" ng-model="item.sel"/>
<span ng-class="{italic: item.sel}">{{item.nome}}</span>
</li>
</ul>
</div>
</body>
</html>
/* Put your css in here */
table td { border: solid 1px #ccc; }
.italic { color: #ccc; }