Reset Angular Factory Details of Each State Change

Question

Ok, I have an app.config.js file that sets up the state provider configuration for users to click on different links and get different data depending on the state (not so important here).

Here is my factory table that presents the table / action data on the screen.

table.factory.js

export default function($filter){

 function Column(title, alias){
    this.title = title;
    this.alias = alias || null;
 }

 let Table = {
      expandAll: false,
      sortReverse: false,
      sortType: null,
      columns: [],
      tableData: null,
      emptyMessage: "No Data.",
      sort: function(column, index){},
      toggleRow: function(index){},
      toggleAll: function(){},
    }

    return {
       table: Table,
       column: Column
    };
}

As you can see, this factory table returns a literal object with 2 properties: table and column.

Here are two additional factories that use table.factory.js.

load_balancing_advanced_table.factory.js:

export default function($http, $stateParams, $filter, tableFactory){

let Table = tableFactory.table;
let Column = tableFactory.column;

Table.sortType = "site_name";
Table.emptyMessage = "No Load Balancing - Advanced Data."
Table.columns.push(
    new Column("Site Name", "site_name"), 
    new Column("VLAN", "vlan"), 
    new Column("HTTP Caching", "http_caching"), 
    new Column("HTTP to HTTPS Redirect", "redirect"),
    new Column("Fallback URL(s)", "fallback_url")
);

return Table;

}

virtual_machines_table.factory.js:

export default function($http, $stateParams, $filter, tableFactory, natTableFactory){


let Table = tableFactory.table;
let Column = tableFactory.column;

Table.totalStorageAllocation = 0.0;
Table.emptyMessage = "No Virtual Machines Data."
Table.sort = null;
Table.sortReverse = null;
Table.columns.push(
    new Column("Host"), 
    new Column("Details"), 
    new Column("Network")
);

return Table;

}

, , table.factory.js, , ( factory ) , "" .

, , , ( ), table.factory.js intial, , , . , (load_balancing_advanced.controller.js virtual_machines.controller.js), , , . , "" factory, "" factory.

virtual_machines.controller.js:

export default function($scope, $stateParams, $filter, virtualMachinesTableFactory, formFactory){

let self = this;
self.virtualMachine = virtualMachinesTableFactory;

}

load_balancing_advanced.controller.js:

export default function($scope, $stateParams, $filter, loadBalancingAdvancedTableFactory, formFactory){

let self = this;
self.loadBalancingAdvanced = loadBalancingAdvancedTableFactory;

}

, , , , - .

, , reset table.factory.js? ?

, factory , "" /.

:

tableFactory->LoadBalancingAdvancedFactory->LoadBalancingAdvancedController
tableFactory->VirtualMachinesFactory->VirtualMachinesController

Answer 1

, , factory , , . - Table. Table.columns. .

// Load Balancing Advanced Table Factory
// The fix Table.columns = [];
Table.columns.push(
   new Column("Site Name", "site_name"), 
   new Column("VLAN", "vlan"), 
   new Column("HTTP Caching", "http_caching"), 
   new Column("HTTP to HTTPS Redirect", "redirect"),
   new Column("Fallback URL(s)", "fallback_url")
);

// Virtual Machines Table Factory
// The fix Table.columns = [];
Table.columns.push(
   new Column("Host"), 
   new Column("Details"), 
   new Column("Network")
);

, factory, :

function Table(columns = [], emptyMessage = "No Data."){
    this.expandAll = false;
    this.sortReverse = false;
    this.sortType = null;
    this.columns = columns;
    this.tableData = null;
    this.emptyMessage = emptyMessage;
}

Table.prototype = {
    setTableData: function(tableData){},
    setSortReverse: function(sortReverse){},
    setSortType: function(sortType){},
    sort: function(){},
    toggleRow: function(index){},
    toggleAll: function(){}
}

return Table;

, , , virtual_machines_table.factory.js, :

/*
   This is a custom property and other properties and methods (omitted) 
   that belongs only to the virtual machines table, which does not exists 
   in the table factory.
   Using a table factory that returns an object literal (same object),
   the load balancing advanced table or any future tables will 
   have those custom methods and properties that belongs in the 
   virtual machines table; this is not what I wanted.
   Returning a function constructor instead will ensure on each content
   change, each table gets its own different table object. 
*/
Table.totalStorageAllocation = 0.0;