Position scroll on the page and not on the Angular Dialog-Material

1

How can I make the scroll of dialog of the page and not the dialog , I think it can be done with css , but I've tried not to achieve a solution.

<html lang = "en">
   <head>
      <link rel = "stylesheet"
         href = "https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
      <script src = "https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>
      <script language = "javascript">
         angular
            .module('firstApplication', ['ngMaterial'])
            .controller('dialogController', dialogController);

         function dialogController ($scope, $mdDialog) {
            $scope.status = '';
            $scope.items = [1,2,3,4,5];
            $scope.showAlert = function(ev) {
               $mdDialog.show (
                  $mdDialog.alert()
                     .parent(angular.element(document.querySelector('#dialogContainer')))
                     .clickOutsideToClose(true)
                     .title('TutorialsPoint.com')
                     .textContent('This is example This is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is example This is example This is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is example This is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is example This is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is example This is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is example This is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is exampleThis is example')
                     .ariaLabel('Welcome to TutorialsPoint.com')
                     .ok('Ok!')
                     .targetEvent(ev)
               );
            };
            
         }                 
      </script>      
   </head>
   
   <body ng-app = "firstApplication"> 
      <div id = "dialogContainer" ng-controller = "dialogController as ctrl"
         layout = "row" ng-cloak>
         <md-content>
            <h4>Standard Alert</h4>
            <md-button class = "md-primary md-raised"
               ng-click = "showAlert($event)" flex = "100"  flex-gt-md = "auto">
               Alert
            </md-button>
            
            
         </md-content>   
      </div>
   </body>
</html>
    
asked by zerokira 12.01.2018 в 20:31
source

0 answers