2016-12-15 4 views
0

私はチュートリアルに基づいてこのコードを作った。私はどのように私は単一のコントローラを使用することができます知りたい。私はコントローラだけを使用して、このダイアログボックスを生成したいと思います。私は現在、2つのコントローラを使用して、このプロジェクトで1つのコントローラにダイアログボックスを生成します。 Angular.js

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

。ありがとうございました。

答えて

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の結果を格納していることに注意してください。

closedismissまたはそのオブジェクトの他の機能にアクセスすることができる他のコントローラにmodalInstanceを注入するのと同じです。

+0

お手伝いできますか? http://stackoverflow.com/questions/41271985/close-all-dialog-boxes-in-angular-js-with-bootstrap – yavg

関連する問題