| <html> | |
| <head> | |
| </head> | |
| <body> | |
| <div ng-controller="PageController"> | |
| <button value="Click to open modal" ng-click="openModal" /> | |
| </div> | |
| <script type="text/template" id="myModalTemplate.html"> | |
| <h1>This is my modal popup template</h1> | |
| <input type="text" ng-model="user.username" /> | |
| <input type="password" ng-model="user.password" /> | |
| <button ng-click="login" value="login" /> | |
| </script> | |
| <script type="application/javascript"> | |
| // Step 1: Include ui.bootstrap module. | |
| angular.module("ModalExampleApp", ["ui.bootstrap"]) | |
| .controller("PageController", function($scope, $uibModal) { | |
| // In the controller that activates the modal (the activating controller), inject the $uibModal service. | |
| // Activate the modal somehow (here, it's with a button). | |
| $uibModal.open({ | |
| controller: "ModalCtrl", | |
| templateUrl: "myModalTemplate.html" | |
| }); | |
| }).controller("ModalCtrl", function($uibModalInstance, $scope) { | |
| $scope.user.username = "John"; | |
| $scope.user.password = "Test"; | |
| $scope.login = function() { | |
| $http.post("/myapp/login", $scope.user).then(function() { | |
| $uibModalInstance.close("ok"); | |
| }); | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment