Angular Material Home
home
Run
screen_rotation
fullscreen
cloud_download
<html lang="en" > <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Angular Material style sheet --> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css"> </head> <body ng-app="DemoApp" ng-cloak> <div ng-controller="myCtrl" class="md-padding" id="popupContainer" ng-cloak> <md-button class="md-primary md-raised" ng-click="showConfirm($event)" > Confirm Dialog </md-button> <div ng-if="status" id="status"> <b layout="row" layout-align="center center" class="md-padding"> {{status}} </b> </div> </div> <!-- Angular Material requires Angular.js Libraries --> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script> <!-- Angular Material Library --> <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script> <!-- Your application bootstrap --> <script type="text/javascript"> /** * You must include the dependency on 'ngMaterial' */ angular.module('DemoApp', ['ngMaterial']) .controller('myCtrl', function($scope, $mdDialog) { $scope.status = ' '; $scope.showConfirm = function(ev) { var confirm = $mdDialog.confirm() .title('Do You Want to delete this?') .textContent("Everything will be deleted and can't be undone .") .ariaLabel('Lucky day') .targetEvent(ev) .ok('Confirm!') .cancel('Cancel'); $mdDialog.show(confirm).then(function() { $scope.status = 'Deleted.'; }, function() { $scope.status = 'Cancelled.'; }); }; }); </script> </body> </html>
<html lang="en" > <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Angular Material style sheet --> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css"> </head> <body ng-app="DemoApp" ng-cloak> <div ng-controller="myCtrl" class="md-padding" id="popupContainer" ng-cloak> <md-button class="md-primary md-raised" ng-click="showConfirm($event)" > Confirm Dialog </md-button> <div ng-if="status" id="status"> <b layout="row" layout-align="center center" class="md-padding"> {{status}} </b> </div> </div> <!-- Angular Material requires Angular.js Libraries --> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script> <!-- Angular Material Library --> <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script> <!-- Your application bootstrap --> <script type="text/javascript"> /** * You must include the dependency on 'ngMaterial' */ angular.module('DemoApp', ['ngMaterial']) .controller('myCtrl', function($scope, $mdDialog) { $scope.status = ' '; $scope.showConfirm = function(ev) { var confirm = $mdDialog.confirm() .title('Do You Want to delete this?') .textContent("Everything will be deleted and can't be undone .") .ariaLabel('Lucky day') .targetEvent(ev) .ok('Confirm!') .cancel('Cancel'); $mdDialog.show(confirm).then(function() { $scope.status = 'Deleted.'; }, function() { $scope.status = 'Cancelled.'; }); }; }); </script> </body> </html>
Copyrights@tutorialsplane.com