Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
    <!-- Angular Material Javascript now available via Google CDN; version 0.8 used here -->
    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.js"></script>
  
   <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.css"> 
</head>
<body ng-controller="MainController">
  <md-button class="md-raised  md-primary" ng-click="showAlert()">Alert</md-button>
  <md-button class="md-raised  md-primary" ng-click="showPrompt()">Prompt</md-button>
  
</body>
</html>
 
angular.module('MyApp',[
  'ngMaterial'
])
.config(function($provide){
      $provide.decorator('$mdDialog', function($delegate) {
        $delegate.prompt = function(options){
           return angular.extend({
             controller : function(scope, $mdDialog){
                scope.hide = function(){
                  $mdDialog.hide();
                };
             },
             template: [
               '<md-dialog aria-label="Promp" class="md-default-theme">',
                   '<md-content class="md-default-theme">',
                     '<h2>My Prompt</h2>',
                     '<input type="text" />',
                     '<div class="md-actions">',
                       '<md-button ng-click="hide()" class="md-raised  md-primary" ng-click="showPrompt()">Ok</md-button>',
                     '</div>',
                   '</md-content>',
               '</md-dialog>'
             ].join('')
           },options);
        };
        return $delegate;
      });
})
.controller('MainController',function($scope,$mdDialog){
  $scope.showAlert = function(){
     $mdDialog.show(
        $mdDialog.alert()
        .title('This is an alert title')
        .content('You can specify some description text in here.')
        .ariaLabel('Alert Dialog Demo')
        .ok('Got it!')
        .targetEvent(document.body)
    );
  };
  
  $scope.showPrompt = function(){
     $mdDialog.show(
        $mdDialog.prompt()
    );
  };
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
crysfelpro
0viewers