Передача данных между контроллерами в модем UIB - PullRequest
Новая
       9

Передача данных между контроллерами в модем UIB

0 голосов
/ 10 сентября 2018

Я написал общий UIB модальный в моем приложении angularjs.Содержимое его тела и нижнего колонтитула должно меняться в зависимости от некоторых ситуаций, поэтому на данный момент я сделал это следующим образом.Код на самом деле работает нормально, но нужно убедиться, что я все делаю правильно ...

Здесь, при нажатии на кнопку модального режима, я фактически сравниваю текст нажатой кнопки. Я не ожидаю модал как директиву.

HTML-код 

<div class="modal-header" >
   <button type="button" class="close" ng-click="close()" data-dismiss="modal">&times;</button>
   <h4><b>{{customModal.title}}</b></h4>
</div>
<div class="modal-body">
 {{customModal.body}}
</div>
<div class="modal-footer" >  
   <span ng-repeat="item in customModal.buttons">
   <button type="button" class="{{item.btnClass}}" ng-click="modalBtnClick(customModal,item);close()" data-dismiss="modal" ng-if="item.show">{{item.text}}</button>
   <span>
</div>

Вызывает модал при нажатии .....

$scope.areYouSureModalInstance = $uibModal.open({
  animation: true,
  templateUrl: 'views/Modal.html',
  controller: 'ModalCtrl',
  windowClass: 'nested-modal',
  scope: $scope,
  resolve: {
    items: function() {
      let btns=[
          {id:1,text:"Yes",show:true, btnClass:"btn btn-success"},
          {id:2,text:"No",show:true, btnClass:"btn btn-danger"},
          {id:3,text:"Cancel",show:true, btnClass:"btn btn-default"}
        ];
      $scope.customModal = {
        id:'confirm',
        title:'Confirm',
        body:'Do you want to save the changes you have made?',
        buttons:btns
      };
      //passes the modal properties
      return $scope.customModal;
    }
  }
});

 //Inside the uib modal controller

   function ModalCtrl($scope) {

    $scope.close = function() {
      $scope.areYouSureModalInstance.close();
    };

     $scope.modalBtnClick=function(data,btn){
      if(data.id==="confirm"){
       $scope.$emit('close.confirm',btn);
      }
   };
 }


//If the user clicks on any button



$scope.$on('close.confirm', function(event, data) {

if (data.text.toLowerCase()==="no") {
  //do some stuff here
 }
if (data.text.toLowerCase()==="yes") {
  //do some stuff here
}
$scope.modalInstance.close();
});

Есть ли лучший способ сделать это с двумя контроллерами и не использовать модальную директиву ...

1 Ответ

0 голосов
/ 10 сентября 2018

$uibModal.open().result возвращает обещание.

Поэтому подпишитесь на результат обещания, выполнив 

$scope.areYouSureModalInstance.then(function(args) {
  //arguments that the modal returned
  console.log(args);
},function () {
  //errors
});

для метода закрытия и подтверждения 

 function ModalCtrl($scope, $uibModalInstance) {

 $scope.close = function() {
   $uibModalInstance.dismiss();
 };

 $scope.modalBtnClick=function(data,btn){
  if(data.id==="confirm"){
   // btn -> arguments that you pass
   $uibModalInstance.close(btn);
  }
 };
}
...