-3

I have a list of employees in Employees view where I can add and a new employee and delete an existing one.

For listing the employees, I use an ng-repeat in the view and I can delete the particular employee by calling my splice method in controller with the passed Id and Index value.

and for editing, I use angular(copy) then update the edited value in DB. Everything is fine regarding to Add a new employee, edit and delete an employee.

I wrote all the codes in single view - single html and its too large in size. I used ng-show / ng-hide to perform add/edit actions.

I would like to break code to several views for add and edit the employee info and I use the same EmployeeController for all the CRUD operations in employee model.

If I break the employee.html to several views then I have to initialize the controller and ended up with losing the data. I can use $rootScope here to persist my data but it will pollute my structure as global is an evil thing.

Please suggest me a best practice to handle this situation. Thanks in advance!

Here is my code,

// To get all employee instances
$scope.getEmpList = function(){
    $scope.employees = EmployeeFactory.getEmpList();
}

// Update employee details
$scope.editEmp = function(empObj){
    $scope.updatedEmpObj = angular.copy(empObj);
    EmployeeFactory.updateEmployee($scope.updatedEmpObj);
}
Joe Clay
  • 33,401
  • 4
  • 85
  • 85
Vinay
  • 548
  • 2
  • 12

1 Answers1

1

You should use a service to hold your data and inject that service into each controller where you need the data. A service is a singleton, and is instantiated only once.

See Using angular service to share data between controllers for more details.

Community
  • 1
  • 1
Ron Brogan
  • 892
  • 1
  • 9
  • 25