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!
Angular apps often share the page with analytics and payment scripts that are not Angular modules. Those scripts execute on the same origin as the framework.
Security insights from Cside