Angularjs how to update view after a REST operation?

GibboK

I am using Angular, I need to refresh the view after DELETE a row. Current code work properly but the Table is not update at all.

Any idea how to change my code?

'use strict'; app.controller('locationsController', ['$scope', 'locationsService', function ($scope, locationsService) {

$scope.locations = [];

locationsService.getLocations().then(function (results) {

    $scope.locations = results.data;

}, function (error) {
    //alert(error.data.message);
});

$scope.deleteLocation = function (locationId) {
    locationsService.deleteLocation(locationId); // UPDATE THE VIEW
};

}]);

<div>
    <div>
        <table>
            <thead>
                <tr>
                    <th>Action</th>
                    <th>LocationId</th>
                    <th>Name</th>
                </tr>
            </thead>
            <tbody>
                <tr data-ng-repeat="location in locations">
                    <td>
                        <a href="#/login">Edit</a>
                        <button ng-click="deleteLocation(location.locationId);">Delete</button>
                    </td>
                    <td>
                        {{ location.locationId }}
                    </td>
                    <td>
                        {{ location.name }}
                    </td>
                </tr>
            </tbody>
        </table>
        <table>
            <thead>
                <tr>
                    <th>LocationId</th>
                    <th>Name</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        {{ location.locationId }}
                    </td>
                    <td>
                        <input type="text" name="{{ location.name }}">
                    </td>
                </tr>
        </table>
    </div>
</div>

'use strict';
app.factory('locationsService', ['$http', function ($http) {

    var serviceBase = 'http://localhost:4014/';
    var locationsServiceFactory = {};

    var _getLocations = function () {

        return $http.get(serviceBase + 'api/locations').then(function (results) {
            return results;
        });
    };

    var _deleteLocation = function (locationId) {
        return $http.delete(serviceBase + 'api/locations/' + locationId).then(function (results) {
            return results;
        });
    };

    locationsServiceFactory.getLocations = _getLocations;
    locationsServiceFactory.deleteLocation = _deleteLocation;

    return locationsServiceFactory;

}]);
sylwester

HTML:

 <button ng-click="deleteLocation(location.locationId, $index);">Delete</button>

JS

$scope.deleteLocation = function (locationId, index) {
    locationsService.deleteLocation(locationId).then(function(){
             $scope.locations.splice(index, 1)

}); // UPDATE THE VIEW
};

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

AngularJS update view after delete operation

From Dev

How to dynamically update view in AngularJS

From Dev

angularjs view does not update after $http

From Dev

AngularJS - How to update data in the View using a Service?

From Dev

AngularJS does not update view after $resouce.query

From Dev

How to update an AngularJS array after sorting?

From Dev

How to update my View after Ajax Post

From Dev

How to update the view after the model has changed?

From Dev

How to update the view after changing the model in Angular?

From Dev

How to update the view after an http request in AngularDart

From Dev

How to update the view after the model has changed?

From Dev

How to update list view item after click?

From Dev

How to update a view without waiting for another operation to finish

From Dev

Constantly update the view angularJs

From Dev

How to update parent view after submitting a form through a partial view?

From Dev

How do I update an angularjs page after a scope update?

From Dev

How to manually update AngularJS view using ControllerAs syntax?

From Dev

How to update AngularJS view when the value has not changed?

From Dev

How can I update a variable from an AngularJS view?

From Dev

How to rest/initial-state a view after this animation?

From Dev

How to automatically load/refresh view data after delete in AngularJS?

From Dev

How to automatically load/refresh view data after delete in AngularJS?

From Dev

How to redirect to home view after page refresh - AngularJS

From Dev

Angularjs view doesn't update

From Dev

AngularJS: View won't update

From Dev

AngularJS: nested array and view update

From Dev

AngularJS doesn't update view

From Dev

Angularjs Update the View in all the machines

From Dev

Update control view in angularjs directive

Related Related

  1. 1

    AngularJS update view after delete operation

  2. 2

    How to dynamically update view in AngularJS

  3. 3

    angularjs view does not update after $http

  4. 4

    AngularJS - How to update data in the View using a Service?

  5. 5

    AngularJS does not update view after $resouce.query

  6. 6

    How to update an AngularJS array after sorting?

  7. 7

    How to update my View after Ajax Post

  8. 8

    How to update the view after the model has changed?

  9. 9

    How to update the view after changing the model in Angular?

  10. 10

    How to update the view after an http request in AngularDart

  11. 11

    How to update the view after the model has changed?

  12. 12

    How to update list view item after click?

  13. 13

    How to update a view without waiting for another operation to finish

  14. 14

    Constantly update the view angularJs

  15. 15

    How to update parent view after submitting a form through a partial view?

  16. 16

    How do I update an angularjs page after a scope update?

  17. 17

    How to manually update AngularJS view using ControllerAs syntax?

  18. 18

    How to update AngularJS view when the value has not changed?

  19. 19

    How can I update a variable from an AngularJS view?

  20. 20

    How to rest/initial-state a view after this animation?

  21. 21

    How to automatically load/refresh view data after delete in AngularJS?

  22. 22

    How to automatically load/refresh view data after delete in AngularJS?

  23. 23

    How to redirect to home view after page refresh - AngularJS

  24. 24

    Angularjs view doesn't update

  25. 25

    AngularJS: View won't update

  26. 26

    AngularJS: nested array and view update

  27. 27

    AngularJS doesn't update view

  28. 28

    Angularjs Update the View in all the machines

  29. 29

    Update control view in angularjs directive

HotTag

Archive