Mukul Sharma Mukul Sharma - 21 days ago 7
CSS Question

how to resize dialogue angular 2

I was following this example plnkr . How can I resize the model (pop up dialogou). I just wanted to know where to add height and width.

Answer Source

Just change style for .modal-dialog div in modal.component.ts:

<div class="modal-dialog" style="width: 200px">
                            ^^^^^^^^^^^^

Plunker Example

You can also set this value dynamically using @Input property

@Component({
  selector: 'app-modal',
  template: `
     ...
    <div class="modal-dialog" [style.width.px]="width">
     `
})
export class ModalComponent {
  @Input() width;

and then in your parent component:

<app-modal #modal1 [width]="200">

Plunker Example