Angular JS : how can I load the factory only once?

Question

I am using a static json file to simulate my server and getting my array of orders from it. I'm presenting the orders in a table in my html file with the option of deleting one from it. Each time I load the html file the full list gets loaded, with the orders I have deleted throught the controller function.

How can I loat the data from the factory only once?

Here is my controller:

app.controller("MainPageCtrl", function($scope, getOrdersFactory)
{
    $scope.orders = [];
    // Getting the data frm the facrory
    var dataPromise = getOrdersFactory.getDataFunc();
    dataPromise.then(function(data){
            $scope.orders = data.orders;
    });

    // Deletes an orders.
    $scope.deleteOrder = function(order){
    // Finds the index of the order.
    var orderIndex = $scope.orders.indexOf(order);

    // Delete the order.
    $scope.orders.splice(orderIndex, 1);
    };
});

What exactly do you mean? Once in a ... what? Do you want to store some data in browser cache? — k102
– k102, Commented Jul 26, 2016 at 8:32

Nijas Nizam · Accepted Answer · 2016-07-26 09:40:45Z

By default angular services and factories are singletons(loaded only once). The problem you are facing is with controller re-initialization. When route change happens the controller is re-initialized so therby getting the previous value from the factory.

You can use a setter function on your 'getOrdersFactory'.

Assuming your 'getOrdersFactory' to be

app.factory('getOrdersFactory',function(){
 //code to read from file and set the file on a variable orderDetails
 var orderDetails = contentsReadFromFile;  
 return{
  getDataFunc:function(){
   return orderDetails
  },
  setDataFunc:function(modifiedOrderDetails){
   orderDetails = modifiedOrderDetails;
   //code to set the new content to the static file
  }
 }
}

code to read the file from the static file will be rendered when you inject the factory for the first time, and on your controller set the order details on the delete function

// Deletes an orders.
$scope.deleteOrder = function(order){
// Finds the index of the order.
var orderIndex = $scope.orders.indexOf(order);

// Delete the order.
$scope.orders.splice(orderIndex, 1);
getOrdersFactory.setDataFunc($scope.orders);
};

Pankaj Kumar · Accepted Answer · 2016-07-26 09:45:13Z

0

I guess you are losing your data i.e $scope.orders .If this is the scenario just change

  dataPromise.then(function(data){
            $scope.orders = data.orders;
    });

to

  dataPromise.then(function(data){
            $scope.orders = angular.copy(data.orders);
    });

answered Jul 26, 2016 at 9:45

Pankaj Kumar

8815 silver badges12 bronze badges

Collectives™ on Stack Overflow

Angular JS : how can I load the factory only once?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related