CODEWITHSUNDEEP
javascriptangularjs
boliwe
boliwe

Reputation: 233

angularjs passing parameter to modal after create

        function MainController($modal){
            var modalOptions = {
                templateUrl: 'templates/mytmp.html',
                controller: 'myController',
                size: size,
                resolve: {
                    items: [1,2,3]
                }
            };

            $modal.open(modalOptions);
        }

I am using the default modal of angularjs and passing parameter [1,2,3].

But I want to call three http request in my MainController and pass this records to modal. Request results are coming async. How can I do this?

function MainController($modal, $http){
   $http("getTwitterFriends").success(onTwitterSuccess);
   $http("getFacebookFriends").success(onFacebookSuccess);
   $http("getGmailPlusFriends").success(onGmailPlusSuccess);

   // I want to list of these records on Modal.
}

Upvotes: 2

Views: 348

Answers (2)

Nikola Yovchev
Nikola Yovchev

Reputation: 10246

http://plnkr.co/edit/gLiwvhDCQPVSRouJDc2m?p=preview

Hey, here is a plunkr:

Basically you want to either chain thens or do a bit more cleanly, using $q.all:

 $q.all([
     SomeServiceWithPromises.someServiceMethodThatReturnsAPromise(),
     SomeServiceWithPromises.someOtherServiceMethodThatReturnsAPromise()
  ]).then(function(results){
    console.log(results, 'both results finished loadin...');
  });

And a link to the docs:

https://docs.angularjs.org/api/ng/service/$q

Upvotes: 0

Muhammad Ahsan Ayaz
Muhammad Ahsan Ayaz

Reputation: 1947

Return promises from factories and chain the async calls to have a sync effect, get a record, push it into items array and then request for next record. Repeat this. Then when all records are retrieved and pushed to modalOptions, open modal.

  function MainController($modal){
                var modalOptions = {
                    templateUrl: 'templates/mytmp.html',
                    controller: 'myController',
                    size: size,
                    resolve: {
                        items: []
                    }
                };
                $http("getTwitterFriends").then(function(record1){ //get first record
                     modalOptions.resolve.items.push(record1);
                      $http("getFacebookFriends").then(function(record2){ //get second record
                          modalOptions.resolve.items.push(record2);
                          $http("getGmailPlusFriends").then(function(record3){ //get third record
                             modalOptions.resolve.items.push(record3);
                             $modal.open(modalOptions); //open modal
                          }
                      });

                });



            }

Upvotes: 1

Related Questions