Last Updated: September 09, 2019
·
4.824K
· iatek

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...

Demo | Source

2 Responses
Add your response

Bug. Your demo fails when you mark items as completed incrementing active items instead of completed.

over 1 year ago ·

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);
};

over 1 year ago ·