Material: dialog: doesn't have a scroll-bar (even in chrome)

[KalpanaAr]

My mdDialog grows bigger in size dynamically without adding a scroll-bar. When it becomes too big, I am not even able to see the beginning of dialog? Is this an issue or am I missing something? Can someone point me in the right direction? Thanks!

 <md-button  
        ng-if="drb.status==='Pending'" 
        class="md-icon-button dialogdemoBasicUsage"  
        flex="100" flex-gt-md="auto" 
        aria-label="comment" 
        ng-controller="commentController" 
        ng-click="commentModal(drb)" 
        style="padding-top:12px;">
              <md-icon md-svg-icon="assets/icons/ic_comment_black_48px.svg" 
                        class="material-icons md-24">
               </md-icon>
</md-button>

   $scope.commentModal = function(drb) {
      $mdDialog.show({
        scope: $scope,
        preserveScope: true,
        controller: DialogController,
        templateUrl: templateUrl,
        parent: angular.element(document.body),
        clickOutsideToClose: true,
        fullscreen: $scope.useFullScreen,
        locals : {drb : drb}
      });
    };

//Modal Controller
    function DialogController(drb, $filter, $scope, $mdDialog) {
      $scope.drbRequest = drb;
      $scope.customFullscreen = $mdMedia('xs') || $mdMedia('sm');
      $scope.useFullScreen = ($mdMedia('sm') || $mdMedia('xs'))  && $scope.customFullscreen;

      $scope.comments = [{who: 'jack', when: 'Dec 3, 2015 12:05 PM', comment: 'Hello'},
                         {who: 'ana', when: 'Dec 6, 2015 12:05 PM', comment: 'hi'},
        {who: 'jack', when: 'Dec 3, 2015 12:05 PM', comment: 'Hello'},
        {who: 'ana', when: 'Dec 6, 2015 12:05 PM', comment: 'hi'},
        {who: 'jack', when: 'Dec 3, 2015 12:05 PM', comment: 'Hello'},
        {who: 'ana', when: 'Dec 6, 2015 12:05 PM', comment: 'hi'},
        {who: 'jack', when: 'Dec 3, 2015 12:05 PM', comment: 'Hello'},
        {who: 'ana', when: 'Dec 6, 2015 12:05 PM', comment: 'hi'},
        {who: 'jack', when: 'Dec 3, 2015 12:05 PM', comment: 'Hello'},
    ....];
};

Screenshot

[ThomasBurleson]

Please provide a CodePen for the above sample. Here are some starter demo templates that you can use/fork:

• CodePen template: http://codepen.io/pen?template=bEGJdd

[KalpanaAr]

@ThomasBurleson Here is the codepen: http://codepen.io/KalpanaArivazhagan/pen/XXPwVV

[TimKlein87]

There are a lot of problems with the code. A lot of the classes are not necessary, you are defining md-dialog twice and there was a div causing problems. I fixed it up a bit and (i think) everything is working as expected: http://codepen.io/anon/pen/obaZRo

[ThomasBurleson]

This issue is closed as part of our deprecation effort.
For details, see our post Spring Cleaning 2016.

[Satej7]

Set height and width properly. Scroll bar will come

openDialog() {
    const dialogRef = this.dialog.open(YourComponent, {
      width: '450px',
      height: '550px',
      data: {}
    });

[Splaktar]

@Satej7 Please submit Angular Material questions here and issues here. This repo is for AngularJS Material.