angular.js redirect crashing browser-Collection of common programming errors

I’m trying to do a simple TODO sample with angular.js (using routes). I could open the form to create a New Task, but when I click on “Back” button (after create a new one), it always crashes my browser.

I’ve tried config the ‘/’ route and use .otherwise too, but I’m still getting the same result.

What I’m doing wrong?

//listTasks.htm

    
    
        
            TODO List
        
        
            
                New Task
                

• {{ task.name }}

            
            
                
            
            
                 
            
                var app = angular.module("appTodoList",['ngRoute']);

                app.config(function ($routeProvider) 
                {
                    $routeProvider
                        .when('/list',
                        {
                            controller:'TodoCtrl',
                            templateUrl: 'listTasks.htm'
                        })
                        .when('/new',
                        {
                            controller:'TodoCtrl',
                            templateUrl: 'newTask.htm'
                        });
                });

                app.controller('TodoCtrl', function($scope) 
                {           
                    $scope.tasks = [];          
                    $scope.addTask = function ()
                    {   
                        $scope.tasks.push({name: $scope.new.TaskName});
                    };
                });


            
        
    

//newTask.htm

    
    

Back

PS: I’m using Firefox 26

1. Firefox crashes because there is an infinite loop in your code. When you nagivate to /listTasks it will load /listTasks again in the ng-view and so on.

   Instead of listTasks.htm containing the route, place the route in another page like index.htm

     $routeProvider.when('/list',
               {
                   controller:'TodoCtrl',
                   templateUrl: 'listTasks.htm'
               })
               .when('/new',
               {
                   controller:'TodoCtrl',
                   templateUrl: 'newTask.htm'
               })
               .when('/',
               {
                   redirectTo: '/list'
               });
   

   By the way, the tasks aren’t being saved because a new controller is created per view instance but that’s an unrelated problem

   See sample