Alan2
Alan2

Reputation: 24562

Is there a way I can wait for the outcome of multiple promises in an angular-ui-router resolve?

Currently my code looks like this:

 resolve: {
            adminTestLevel: ['testService', (tes: ITestService) => {
                return tes.getAdminTestLevel();
            }],
            adminTestStatus: ['testService', (tes: ITestService) => {
                return tes.getAdminTestStatus();
            }],
            adminTestType: ['testService', (tes: ITestService) => {
                return tes.getAdminTestType();
            }],
            adminTestGradeType: ['testService', (tes: ITestService) => {
                return tes.getAdminTestGradeType()
            }],
            exams: ['testService', (tes: ITestService) => {
                return tes.getExams();
            }],
            examTypes: ['testService', (tes: ITestService) => {
                return tes.getExamTypes();
            }],
            testOrderBy: ['testService', (tes: ITestService) => {
                return tes.getTestOrderBy();
            }],
            topics: ['testService', (tes: ITestService) => {
                return tes.getTestsTopics();
            }],
        },

Is there a way that I could simplify this so that I don't have to have so many injections of the ITestService? Also I don't need to have all the different resolves and if possible I would like to combine these into one.

Upvotes: 0

Views: 78

Answers (2)

Scantlight
Scantlight

Reputation: 253

you could try to use $q.all(promises)

from documentation for ($q):

$q.all(promises);
Combines multiple promises into a single promise that is resolved when all of the input promises are resolved.

so you can combine multiple promises in an array of promises and wait for resolve. you code could look like:

resolve: {
    required_data: function($q, testService) {
        return $q.all([
            testService.getAdminTestLevel(),
            testService.getAdminTestStatus(),
            testService.getAdminTestType()

            // and so on for all other promises
        ])
    }
}

then in your controller, also from the same documentation

$q.all(promises)
Returns a single promise that will be resolved with an array/hash of values, each value corresponding to the promise at the same index/key in the promises array/hash

you could access the result from required_data injected into your controller.
for example adminTestLevel will be available at required_data[0] ... and so on, in the same order you have created your promise array in router.

Upvotes: 1

svarog
svarog

Reputation: 9839

You can use $q.all

resolve: {
    myDate: function($q, tes) {     
        return $q.all([tes.getAdminTestLevel(), ... , tes.getTestsTopics()]);
    }
}

myData will only resolve after all the promises in the array will resolve

$q.all will give you an array of results you can use in your controller, you could access them by index so it's less convenient then plain injection.

Upvotes: 1

Related Questions