.run getting triggererd for all view - AngularJS

Question

I have created an application with angularjs having the ng-view feature. The application works fine but the problem is for all the view the .run within the employee module is getting executed.Since within that .run i have a service call, so when i switch to either department, employee or humanresource view the .run is getting executed which is supposed i need to get executed when employee view is triggered.

can anyone please tell me some solution for this

angular.module('main', ['employee', 'department', 'humanresource', 'ngRoute'])

    .config(
        function($routeProvider)
        {
        $routeProvider.when('/humanresource',
                    {
                        templateUrl: 'humanresource/resource.html',
                        controller: 'EmployeeCtrl'
                    }).when('/employee',
                    {
                        templateUrl: 'employee/employee.html',
                        controller: 'HumanResourceCtrl'
                    }).when('/department',
                    {
                        templateUrl: 'department/department.html',
                        controller: 'DepartmentCtrl'
                    }).otherwise(
                    {
                        redirectTo: '/employee'
                    });
        }
    );

employee.js

angular.module('employee', [ 'common' ] )
.run(function($rootScope, EmployeeDetails)
{
    $rootScope.employeeDetails = EmployeeDetails.get(function(data)
    {
        $rootScope.employeeDetails = _.clone(data.properties, true);
    });
})
.controller('EmployeeCtrl', function($rootScope, $scope)
{
 :
 :
}
);

department.js

angular.module('department', [ 'common' ] )

.controller('DepartmentCtrl', function($rootScope, $scope)
{
 :
 :
}
);

humanresource.js

angular.module('humanresource', [ 'common' ] )

.controller('HumanResourceCtrl', function($rootScope, $scope)
{
 :
 :
}
);

employee.html

<div>
    <form  ng-submit"submitEmployee()">
       <div ng-controller="EmployeeCtrl">
        :
        :// content for the emnployee adding and display
        :
        :
      </div>
    </form>
</div>

department.html

<div>
    <form  ng-submit"submitDepartment()">
       <div ng-controller="DepartmentCtrl">
        :
        :
        :// content for the department adding and display
        :
       </div>
    </form>
</div>

OK. is that all in your htmls? Do you have any script imports in department.html? — Mathews, Jun 03 '14 at 10:19
And in your route config the controllers and interchanged for /humanresource and /employee — Mathews, Jun 03 '14 at 10:20
http://stackoverflow.com/questions/11972026/delaying-angularjs-route-change-until-model-loaded-to-prevent-flicker/11972028#11972028 — Sam P, Jun 03 '14 at 10:44

Mathews · Answer 1 · 2014-06-03T10:38:49.177

1

If you want to execute the mentioned code each time you visit the employee page(and not for other views), then move the code to inside EmployeeCtrl as follows

angular.module('employee', [ 'common' ] )
.controller('EmployeeCtrl', function($scope,EmployeeDetails)
{

 $scope.employeeDetails = {};

  EmployeeDetails.get(function(data)
    {
        $scope.employeeDetails = _.clone(data.properties, true);
    });
});

edited Jun 03 '14 at 10:38

answered Jun 03 '14 at 10:24

Mathews

909
1
7
13

The thing is for employees i want to execute the `EmployeeDetails.get(..` first before loading the `EmployeeCtrl` controller, if we put that within the controller there is no promise right – Alex Man Jun 03 '14 at 10:35
I have edited the answer, sure you will get the promise in the controller. When you get the response back from EmployeeDetails.get the view(employee.html) will get updated with the data – Mathews Jun 03 '14 at 10:40

.run getting triggererd for all view - AngularJS

1 Answers1