Making TodoMVC AngularJS Responsive with Bootstrap 3
A great way to learn more about Angular MVC and other MV* JavaScript frameworks is to check out the working TodoMVC example projects...
TodoMVC provides offers same Todo list application implemented using MV* concepts in most of the popular JavaScript MV* frameworks of today like Angular, Backbone, Ember, Knockout and several others.
Lately I played around with the AngularJS version of the TodoMVC project, and made a responsive "mobile-first" version using the latest Bootstrap 3.1. Check it out on Bootply...
Written by Carol Skelly
Related protips
2 Responses
Bug. Your demo fails when you mark items as completed incrementing active items instead of completed.
The bug is here:
$scope.todoCompleted = function (todo) {
$scope.remainingCount += todo.completed ? -1 : 1;
todoStorage.put(todos);
};
Changed to this and the application works:
$scope.todoCompleted = function (todo) {
$scope.remainingCount += todo.completed ? 1 : -1;
todoStorage.put(todos);
};
Have a fresh tip? Share with Coderwall community!
AngularJS pages are long-lived browser apps with the same script risk as a newer single-page app. Third-party code in the template can read forms and values rendered on the page.
Security insights from Cside