Создайте диалоговое окно в одном контроллере. Angular.js

Question

Я сделал этот код на основе учебника. Я хочу знать, как я могу использовать один контроллер. Я хочу сгенерировать это диалоговое окно, используя только контроллер.

http://fiddle.jshell.net/adnu6mmt/2/?utm_source=website&utm_medium=embed&utm_campaign=adnu6mmt

В этом проекте я в настоящее время используют 2 контроллера. Спасибо.

Answer 1

Вам нужно будет сохранить экземпляр модала и использовать его в одном контроллере. Прежде всего, необходимо изменить HTML, как это:

<div ng-app="myApp"> 
    <script type="text/ng-template" id="myModal.html"> 
    <div class="modal-header"> 
     <h3 class="modal-title">Modal title</h3> 
    </div> 
    <div class="modal-body"> 
     Modal content 
    </div> 
    <div class="modal-footer"> 
     <button class="btn btn-primary" ng-click="close(true)">OK</button> 
     <button class="btn btn-warning" ng-click="close(false)">Cancel</button> 
    </div> 
</script> 

<div ng-controller="MyCtrl"> 
    <input type="button" value="Show modal" ng-click="showModal()"/> 
</div> 

, а затем в контроллере:

.controller("MyCtrl", function($scope, $modal) { 

    var modalInstance = null; 

    $scope.close = function (ok, hide) { 
     if(ok) { 
      alert('ok'); 
     } else { 
      alert('cancel'); 
     } 

     modalInstance.dismiss(); 
    }; 

    var modalScope = $scope.$new(); 

    $scope.showModal = function() {  
     modalInstance = $modal.open({ 
      templateUrl: 'myModal.html', 
      scope: modalScope 
     }); 
    } 
}); 

Если вы хотите, чтобы контролировать модальность в том же контроллере необходимо иметь доступ к нему, обратите внимание, что мы сохраняем результат $modal в переменной для последующего использования.

Это равнозначно закачиванию modalInstance другому контроллеру, который позволяет вам получить доступ к close, dismiss или другим функциям на этом объекте.