All stories published by Dialog Component Angular (5) on January 21, 2018

Homepage

Open in app

All Stories published by Dialog Component Angular (5) on January 21, 2018

All

2018

January

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

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:

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

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…

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

[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

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

[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

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

Dialog Component — Angular (5) | Message Service

On the previous article we have created the Message Component. So now we are going to give it some live :)

The Message Service is the one that you will be using across your project. So whenever you need to invoke the…

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

[Dialog Component — Angular (5)] Component

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

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

[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.

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

Dialog Component — Angular (5) | Core Module

On the previous article we have created the Dialog Module, which is responsible to wrap the whole Dialog Component, Services and Models. So now, we are going to create the Core Module.

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

Dialog Component — Angular (5) | Message Model

So up to now, we have the Dialog Component ready to be consumed. As per our previous articles, you might noticed that I like to organise the code to make it as cleared as possible, so for the Message Service we are going to do the same. Let's start…

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

[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…

Thiago Bernardes in Dialog Component Angular (5)

Jan 21, 2018

Dialog Component — Angular (5) | Consuming the Dialog Component

On the previous article, we have created the Core Module as a Singleton, to make it available across the whole project. So the App Module is the one that will make it happen!