How to instantiate some objects in service before controller uses the service objects when its view is loaded

Question

I have a stateprovider which loads view and setup controller. Now the controller depends on service which should provide updated objects. For example, i have a state - s, with template v, and controller c. c depends on service s. s has method -lets say 'sm' which fetches data from AJAX. Now I want the 'sm' to be only called when the state is loaded but before controller is instantiated.

I know it can be done with resolve, but how to order the loading of service method before controller is instantiated.

I am using oclazylaod based function 'loadSequence' which loads scripts in particular order.

ex.

.state('member.course', {
       url: "/course",
       templateUrl: "assets/views/course.html",
       controller: 'coursecontroller',
       resolve: loadSequence('someservice', 'coursecontroller', 'toaster', 'ngImgCrop'),
       data: {
         css: 'assets/css/course.css'
       }
     })

I want the someservice.getData method to be called before my 'courseController' is loaded. How to do it?

Edit- loadSequence;:-

 function loadSequence() {
     var _args = arguments;
     return {
       deps: ['$ocLazyLoad', '$q',
         function($ocLL, $q) {
           var promise = $q.when(1);
           for (var i = 0, len = _args.length; i < len; i++) {
             promise = promiseThen(_args[i]);
           }
           return promise;

           function promiseThen(_arg) {
             if (typeof _arg == 'function')
               return promise.then(_arg);
             else
               return promise.then(function() {
                 var nowLoad = requiredData(_arg);
                 if (!nowLoad)
                   return $.error('Route resolve: Bad resource name [' + _arg + ']');
                 return $ocLL.load(nowLoad);
               });
           }

           function requiredData(name) {
             if (jsRequires.modules)
               for (var m in jsRequires.modules)
                 if (jsRequires.modules[m].name && jsRequires.modules[m].name === name)
                   return jsRequires.modules[m];
             return jsRequires.scripts && jsRequires.scripts[name];
           }
         }
       ]
     };
   }

can you provide the loadsequence method – VISHAL DAGA Feb 16 '16 at 08:36 — VISHAL DAGA, Feb 16 '16 at 08:36

VISHAL DAGA · Accepted Answer · 2016-02-16T09:07:51.103

0

I have faced same situation before, and this is how I resolved it..

.state('member.course', {
       url: "/course",
       templateUrl: "assets/views/course.html",
       controller: 'coursecontroller',
        resolve: {
              b: ['someservice', function(someservice) {
                return someservice.getData();//as its a ajax request it will return a promise
              }],
              a: ['b', function(b) {
                return angular.element(document.body).injector().invoke(loadSequence('coursecontroller', 'toaster', 'ngImgCrop')['deps'])
              }]
            },
       data: {
         css: 'assets/css/course.css'
       }
     })

edited Feb 16 '16 at 09:07

answered Feb 16 '16 at 08:38

VISHAL DAGA

4,132
10
47
53

Thanks for the quick answer, let me try this... will get back – Shashi Feb 16 '16 at 08:40
1

can you explain how the resolve is written and working? – Shashi Feb 16 '16 at 09:10
in the 'resolve' - 'a' is dependent on 'b', so Angular will first resolve 'b', hence you can be rest assured your 'someservice.getData()' will get executed first and by the time the controller is instantiated (which is inside 'a'), it can get the data from the service. – VISHAL DAGA Apr 19 '16 at 12:35

How to instantiate some objects in service before controller uses the service objects when its view is loaded

1 Answers1