我的服务不会立即显示变化.必须刷新浏览器

我编写了一个服务来处理检索、添加和删除任务的http请求。现在我面临的问题是，当我添加或删除一个任务的变化不显示视觉。我得刷新一下页面。

如何解决这个问题

我的angular代码(部分):

zazzleApp.factory('TaskService', function ($http) {
    var TaskService = {};
    TaskService.taskList = [];
    TaskService.getTasks = function(){
        $http.get('api/task/all')
            .success(function(dataFromServer){
                for (var i = 0; i < dataFromServer.length; i++) {
                    TaskService.taskList[i] = dataFromServer[i];          
                };
                //console.log('LOGGING GET_TASK ',  TaskService.taskList);
                return dataFromServer;
            })
            .error(function(errorFromServer){
            //something went wrong, process the error here
                console.log("Error in getting the users from the server ", errorFromServer);
            })
    };
    TaskService.addTask = function(pTask){
        var url;
        console.log(editId);
        if (editId) {
            url = 'api/task/update/' + editId;
        } else {
            url = 'api/task/create';
        }
        console.log("URL URL USA", url, editId);
        defaultStart = new Date(clickDate);
        defaultStart = defaultStart.getFullYear() + "-" + (defaultStart.getMonth() + 1) + "-" + defaultStart.getDate();
        defaultStart += " 00:00:00";
        console.log("YYYYYYYYYYYYY -------->>>>>", defaultStart);
        defaultEnd = new Date(clickDate).addDays(1);
        defaultEnd = defaultEnd.getFullYear() + "-" + (defaultEnd.getMonth() + 1) + "-" + defaultEnd.getDate();
        defaultEnd += " 00:00:00";
        console.log(defaultStart, defaultEnd);
        pTask.color = $('#containerColorPicker').attr('ng-data-id');
        return $http.post(url, {
            'name': pTask.project_name,
            'project_id': pTask.project_type,
            'location_id': pTask.location,
            'estimate_time': pTask.estimate_time || 2,
            'project_client_name': pTask.project_client_name,
            'url': pTask.url,
            'resource_link': pTask.resource_link,
            'notes': pTask.notes,
            'start_time': defaultStart,
            /*'start_time': pTask.start_time || defaultStart,*/
            'end_time': pTask.end_time || defaultEnd,
            'color': pTask.color
        }, {
            headers: {
                "Content-Type": "text/plain"
            }
        })
        .success(function(data, status, headers, config) {
                console.log(data);
                TaskService.taskList.push(data);
        })
        .error(function(data, status, headers, config) {
            console.log("Failed to add the task to DB");
        });
    };
    TaskService.deleteTask = function (){
        if (editId) {
            //console.log('logging editId in service delete task ', editId);
        $http.delete('api/task/delete/' + editId, {
            })
            .success(function(data, status, headers, config) {
                for (var i = 0; i < TaskService.taskList.length; i++) {
                    if(TaskService.taskList[i]._id == editId){
                        //index = i;
                        console.log ("removing the element from the array, index: ", editId, i);
                        TaskService.taskList.splice(i,1);
                    }
                };
                console.log('taskArray ', TaskService.taskList, editId, i);
                $('#tile[ng-data-id="'+ editId +'"]').remove();
            })
            .error(function(data, status, headers, config) {
                console.log("You were NOT succesfull in deleting a task");
            });
        }
    };
    return TaskService;
})

//START CONTROLLER
angular.module('zazzleToolPlannerApp')
    .controller('CalendarCtrl', function ($scope, $mdDialog, $http, $rootScope, $timeout, User, Auth, UserService, TaskService) {
        $scope.newTask = {};
        $scope.newTask.project_name = "";
        $scope.newTask.project_type = "";
        $scope.newTask.location = "";
        $scope.newTask.estimate_time = "";
        $scope.newTask.project_client_name = "";
        $scope.newTask.url = "";
        $scope.newTask.resource_link = "";
        $scope.newTask.notes = "";
        $scope.newTask.color = "";
        //console.log('00000000000 ', $scope.newTask); //empty
        $scope.tasks = TaskService.taskList;
      $scope.getTasksFromService = function () {
            TaskService.getTasks(); //after this gets called, the data will be shown in the page automatically   
        }
        $scope.getTasksFromService();
        $scope.addTaskWithService = function () {
            //note that you can process the promise right here (because of the return $http in the service)
            TaskService.addTask($scope.newTask)
                .success(function(data){
                    //here you can process the data or format it or do whatever you want with it
                    console.log("Controller: the task has been added");
                    $scope.tasks = [];// EMPTY THE ARRAY
                    TaskService.getTasks();
                    $scope.updateGridDataAwesome();
                })
                .error(function(data){
                    //something went wrong
                    console.log("Controller: error in adding task");
                });         
        }
        $scope.deleteTaskWithService = function(){
            TaskService.deleteTask();
        }
});
//END CONTROLLER