Question

我开发了常见的警报模式，用于错误，警告，使用角度基础模态进行确认。我的问题是，我无法将变量传递给模态。模态内容：

 <h3 class="caps">{{ alertmessage }}</h3>
   <p>{{ alertdetail }}</p>

开放式提醒服务：

appCommonServiceModule.factory('AlertModalService' , function($modal ,$rootScope){
       function AlertModalService(){
           this.openAlertModal = function($scope,type ,message , detail , successCallback ,cancelCallback ){
               var  templateUrl = ASSETS_PATH+'app/pages/templates/alert/';
               var  className = "reveal-modal small alert-modal ";
               if(type == "SUCCESS"){
                   templateUrl = templateUrl+"success.html";
                   className += "success-modal"
               }
                   $scope.message = message;
                   $scope.detail = detail;
                     var modalInstance  = $modal.open({
                         templateUrl : templateUrl,
                         controller : 'AlertBaseController',
                         backdrop: 'static',
                         windowClass:className,
                         scope:$scope,
                         resolve : {
                             alertmessage: function(){
                                 return $scope.message;
                             },
                             alertdetail :function(){ return $scope.detail; 
                     }
                         }
                     });
                     modalInstance.result.then(function(){
                          if(successCallback){
                              successCallback();
                          }
                     },function(){
                          if(cancelCallback){
                              cancelCallback();
                          }
                     });
           }
       }
       return  new AlertModalService();
    });

我找不到解决办法谢谢你的帮助

Answer 1

首先，您的工厂需要定义类似接口的东西，以便能够与控制器共享其数据：

appCommonServiceModule.factory('AlertModalService' , function($modal, $rootScope) { 
   // [...] your code

   service = {
      getModalData: getModalData
   };
   return service;

   function getModalData() {
      var modalData = {};
      modalData.message = message;
      modalData.detail = detail;
      return modalData;
   }

   // [...] your code
});

其次，您需要控制器在HTML中显示数据。您已经在代码中定义了一个（controller: 'AlertBaseController'），因此您可以使用它：

appCommonServiceModule.controller('AlertBaseController',  function(AlertModalService, $scope) {
   var modalData = AlertModalService.getModalData();
   $scope.alertmessage = modalData.message;
   $scope.alertdetail = modalData.detail;
});

现在您可以在HTML中使用它了：

<div ng-app="appCommonServiceModule">
   <div ng-controller="AlertBaseController">
      <h3 class="caps">{{alertmessage}}</h3>
      <p>{{alertdetail}}</p>
   </div>
</div>

我还没有对它进行过测试，因为我没有完整的代码，但是这样的事情应该可行。

角度 - 基础模态解决方案

1 个答案: