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

Thiago Bernardes
Dialog Component Angular (5)
2 min readJan 21, 2018

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!

In the app.module.ts (generated by the ng-cli) we have the following import


imports: [
BrowserModule
],

then, we will need to import the core.module and add it into the imports


import { CoreModule } from ‘./core.module’

imports: [
BrowserModule,
CoreModule.forRoot()
],

This step will make our CorModule a Singleton, so when the project is started, it will be loaded once and enable all the solution to use this instance, even the lazy modules.

Ok ok, maybe you are anxious to see it on action. Well, I am lol, so let go to the finals steps.

Recap, we have built our Dialog Component. As you could notice along the tutorial, the Dialog Component ia a generic component that will handle the behaviour for the user actions, and mainly, be able to the developer extend and have multiple king of Dialogs in one project. For example, you can have an Error Dialog, an Alert Dialog or also a Confirmation Dialog.

On the next article, we will be creating the Message Service! I will be covering on how to create the Alert Dialog, and as a homework you can extend it to an Error Dialog and also Confirmation Dialog (I'll be here if you need any help, but I encourage you to do it on your own to evolve your developer logical).

As the hardest code is done, the following will be quick and easy :) so let's do it on the next article!

<< Previous = MENU = Next >>

--

--

Thiago Bernardes
Dialog Component Angular (5)

Focused on Human-Centered Design & working collaboratively with different areas, I combine the IT background with UX experience to create innovative solutions