AngularJS在创建后将参数传递给模态

angularjs passing parameter to modal after create

本文关键字：参数传递 模态 创建 AngularJS      更新时间：2023-09-26
        function MainController($modal){
            var modalOptions = {
                templateUrl: 'templates/mytmp.html',
                controller: 'myController',
                size: size,
                resolve: {
                    items: [1,2,3]
                }
            };
            $modal.open(modalOptions);
        }

我正在使用 angularjs 的默认模态并传递参数 [1,2,3]。

但是我想在我的MainController中调用三个 http 请求并将此记录传递给 modal。请求结果是异步的。我该怎么做？

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.
}

从工厂返回承诺并将异步调用链接起来以获得同步效果，获取记录，将其推送到 items 数组中，然后请求下一条记录。重复此操作。然后，当检索所有记录并将其推送到模态选项时，打开模态。

  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
                          }
                      });
                });

            }

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

嘿，这是一个 plunkr：

基本上，您希望使用$q.all进行链接或更干净地执行操作：

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

以及指向文档的链接：

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

相关文章：