0

I'm using a Dialog as a Form Container but when I have many Fields or a long h3 title, it gets strange, since the width is small (280px).

Is there a way to change it's width without having to change it's css? Maybe a width property?

1 Answers1

1

The version 2.2.0 of angular2-mdl now supports advanced configuration possibilities. You now can provide css styles that are applied to the dialog host element. For example:

let pDialog = this.dialogService.showCustomDialog({
  component: LoginDialogComponent,
  providers: [{provide: TEST_VALUE, useValue: 'Just an example'}],
  isModal: true,
  styles: {'width': '350px'},
  clickOutsideToClose: true
});

If you are using the declarative approach this is also possible:

<mdl-dialog #editUserDialog
            [mdl-dialog-config]="{
                 clickOutsideToClose: true, 
                 styles:{'width': '350px'}, 
                 modal:true
            }">
...
</mdl-dialog>
michael
  • 16,221
  • 7
  • 55
  • 60
  • I'm not using angular2 anymore, and don't have an easy way to test it. I'm going to mark your answer as correct, but if anyone could test it and confirm would be nice too! – Rodrigo Maller Martins Jun 01 '17 at 20:44