Система все еще вызывает функцию объема для $ modal controller после закрытия - PullRequest
Новая
       12

Система все еще вызывает функцию объема для $ modal controller после закрытия

0 голосов
/ 22 апреля 2020

Я работаю над проектом AngularJS. Пожалуйста, имейте в виду, что это Angularjs версия 1. В этом проекте у меня есть контроллер, который связан со страницей html. В этом контроллере я определил функцию с $ rootScope.

Теперь на этой странице я также использую всплывающее окно. Я показываю это всплывающее окно, используя $ модальный компонент. Это модальное всплывающее окно также связано с контроллером, который также выполняет ту же функцию, определенную в $ rootScope.

Ниже приведен мой краткий код: 

angular.module('myapp').controller('pageCtrl', function($rootScope, $modal){

      $rootScope.getRecords = function() {
        //Do some action
      }
      
      $rootScope.openModal = function(){
          var modalInstance = $modal.open({
            templateUrl: 'modal.html',
            controller: modalCtrl
          });
          
          modalInstance.result.then(function(result){}, function(cancel){});
      }
    });
    
    angular.module('myapp').controller('modalCtrl', function($rootScope, $modal){

      $rootScope.getRecords = function() {
        //Do some action
      }
      
      $rootScope.closeModal = function(){
          $modalInstance.dismiss('cancel');
      }
    });
    
    
    
<!-- Page Html -->
<div class="" ng-controller="pageCtrl">
 <button class="btn" ng-click="openModal()">Open Modal</button>
 <button class="btn" ng-click="getRecords()">Get Record</button>
</div>

<!-- modal.html -->
<div class="">
    <p>You are in Modal Box</p>
    <button class="btn" ng-click="closeModal()">Close Modal</button>
</div>

Вы можете видеть в моем коде, я определил ту же функцию в контроллере страницы, а также в модальном контроллере. Когда я нажимаю кнопку «Получить запись» перед вызовом модального режима, система вызывает функцию, определенную в контроллере страницы, и это нормально. Но когда я открываю модальное, а затем закрываю, а затем снова нажимаю кнопку «Получить запись», система вызывает функцию, определенную в контроллере режима, а не в контроллере страницы.

Я не могу понять, почему он вызывает функцию модального контроллера после открытия модального окна. Может кто-нибудь, пожалуйста, помогите мне в этом.

1 Ответ

0 голосов
/ 22 апреля 2020

Я полагаю, что вы используете Bootstrap 1 для AngularJS

Почему он вызывает внутренний метод getRecords() - потому что вы переопределяете его.

Do: 

$rootScope.getRecords = function() {
    alert("external 1");
}

$rootScope.getRecords = function() {
    alert("external 2");
}

и после вызова вы получите "external 2".

Я не уверен, почему вы используете $rootScope внутри $modal, но это не очень хорошая практика.

Если вы хотите позвонить на внешний номер getRecords, вы можете написать:

Вариант 1 

$scope.getRecords = function() {
   alert("external");
}

var modalInstance = $modal.open({
  templateUrl: 'modal.html',
  controller: modalCtrl,
  resolve: {
    callback: function () {
      return $scope.getRecords
    }
  }
});

и ваш модал: 

angular.module('myapp').
controller('modalCtrl', function($scope, $modalInstance, callback){

  $scope.getRecords = function() {
    callback();
   }

  $rootScope.closeModal = function(){
      $modalInstance.dismiss('cancel');
  }
});

plunker Пример

Опция 2

Другой способ - использовать тот же $scope для $modal : 

 var modalInstance = $modal.open({
   templateUrl: 'myModalContent.html',
   controller: 'ModalInstanceCtrl',
   scope: $scope
 });

plunker Пример 2

...