Dialog Component — Angular (5) | Models

The models we are going to create here is to keep the component organised and also give more support to the Dialog Component.

We are going to create the files IN BOLD below within the folder MODELS:

Dialog Component — Angular (5)

TL;DR This is a step-by-step to create your own Dialog in Angular (5). You can walk through the steps to make it happen and understand a…

[Dialog Component — Angular (5)] Backdrop

The backdrop is responsible to bring attention to the Dialog and also avoid the user to navigate on the website while the dialog is opened

[Dialog Component — Angular (5)] Service

The service is the heart of the Dialog. It will give live to the Dialog component.

Dialog Component — Angular (5) | Service

[Dialog Component — Angular (5)] Component

Let's create the Dialog Wrapper that will make the dialog able to inject different and customisable dialogs mesages.

[Dialog Component — Angular (5)] Message Component

Creating the Message UI.

Dialog Component — Angular (5) | Message Component

On the previous article we have created the Message Model and Enum. So let's make the Message UI.

[Dialog Component — Angular (5)] Module

The Dialog Module is responsible to assembly all the Dialog Components, which is helpful to import it to make them available on the…