Restangular/angularjs object not updating after using remove()

Question

I'm using Restangular in my Angularjss. I have an index view that displays all messages. I can edit these messages and add to the list without problem. When I try to use remove() via the element, the index page displaying all the messages doesn't update. I must refresh the page. I do not need to refresh the page after an addition or edit.

Sorry for not including a plunker but I'm not sure how to get a working example since my API is local.

I inject the messages object via resolve:

$routeProvider.when('/', {
    templateUrl: 'messages-index.html',
    controller: 'MessagesController',
    resolve: {
        messages: function(Restangular) {
            return Restangular.all('messages').getList();
        }
    }
});

And use ng-repeat To display the messages in the index view:

<li ng-repeat="message in messages | filter:query | filter:typeQuery class="messages__item">
    <p>
        <a href="#/messages/{{ message.id }}/">{{ message.message }}</a>
        <a class="round secondary label">{{ message.type }}</a>
    </p>
</li>

In the edit view, I inject the specific message via resolve:

$routeProvider.when('/messages/:messageId/edit', {
    templateUrl: 'messages-edit.html',
    controller: 'MessagesEditController',
    resolve: {
        message: function(Restangular, $route) {
            return Restangular.one('messages', $route.current.params.messageId).get();
        }
    }
});

Lastly, my MessagesEditController looks like this:

.controller('MessagesEditController', ['message', '$scope', '$location', 'Restangular', function(message, $scope, $location, Restangular) {
        var original = message;
        $scope.message = Restangular.copy(original);

        $scope.editMessage = function() {
            $scope.message.put().then(function(){
                $location.path('/');
            }, function(response) {
                $scope.formErrors = response.data.error.params;
            });
        };

        $scope.deleteMessage = function() {
            original.remove().then(function() {
                $location.path("/");
            });
        };
}])

Anyone know why my messages object is not updated in the index view after removal?

Cheers!

Answer 1

Restangular for some reason leaves it up to the user to update their $scope after a remove operation. Depending on the use case it may be useful.

original.remove().then(function() {
    $scope.messages = _.without($scope.messages, original);
});