How to save in AngularJS using set and $http.post

Question

I have a website that takes API from Django and retrieves the data and visualizes in HTML. Now I want to save it each time I enter a website, so even if I refresh the page or close the server it won't disappear, but will be introduced to the table.

This is my code for using the API to retrieve data:

angular
    .module('inspinia')
    .controller('ListWebsiteCtrl', ['$scope', '$http', function ($scope, $http) {
        $scope.set = function (new_url) {
            $scope.data = new_url;
            $http.post("http://127.0.0.1:8000/api/website/" + this.get_url.url).success(function (data) {
                $scope.websites = data.websites;
        });
        };
    }]);

This is my HTML:

<form ng-controller="ListWebsiteCtrl">
    <input title="get_url.url" ng-model="get_url.url">
    <button ng-click="set(get_url.url)">INSERT WEBSITE</button>
    <table class="table">
        <tr>
            <th>ID</th>
            <th>URL</th>
            <th>Status</th>
        </tr>
        <tr>
            <th>{{ websites.id }}</th>
            <th>{{ websites.url }}</th>
            <th>{{ websites.status }}</th>
        </tr>
    </table>
</form>

What is the most efficient way to do it?

Answer 1

Use Indexed DB It is a low-level API for client-side storage of significant amounts of structured data, including files/blobs. This API uses indexes to enable high-performance searches of this data. While Web Storage is useful for storing smaller amounts of data, it is less useful for storing larger amounts of structured data.