ngx-dialog v0.2.4

Notice!

It is a copy of ng-bootstrap modal with only a little change.

You can use ngx-dialog without the dependency of bootstrap or ng-bootstrap.

Getting Started

Installation

npm install ngx-dialog --save-dev

Import to App module

import { NgxDialogModule } from 'ngx-dialog';
@NgModule( {
	imports: [
		...

NgxDialogModule.forRoot(), ], ... } ) export class AppModule { }

Import styles

There are two ways to import the styles .

@import "~ngx-dialog/styles";

in one of you style files.

OR

import "nix-dialog/styles";

in one of your ts files, for example vendor.ts.

Methods

open( content:any, options:NgxDialogOptions )

NgxDialogService

The same as ng-modal, but add some more options:

data

Example

import { Component } from '@angular/core';
import { NgxDialogService }  from 'ngx-dialog';

@Component({

selector: 'page-dialog', template: <button (click)="open(myDialog)">Button</button> <ng-template #myDialog let-c="close"> This dialog looks ugly by default <button (click)="c()">Close</button> </ng-template> }) export class PageDialogComponent { constructor( private ngxDialog: NgxDialogService ) {}

	open( content:any ) {
		this.ngxDialog.open( content, {
			windowClass: 'mydialog'
		} );
	}
}

Tips

• The custom styles need to be put in the global scope style if the container of the dialog is body.