Basic usage

Branch

Create the alert UI

the DaisyUI library provides a alert component that can be used to display a message to the user.

Instructions

1. Update the template of alert-banner.component.ts file:

   <div role="alert" class="alert alert-vertical alert-info alert-soft">
   <span>12 unread messages. Tap to see.</span>
   <div>
       <button class="btn btn-sm">Deny</button>
       <button class="btn btn-sm btn-primary">Accept</button>
   </div>
   </div>

Display the component

Let’s now display the banner in the TaskList and TaskForm components.

Instructions

1. Update the template of task-list.component.ts file:

   <app-alert-banner />

2. Update the template of task-form.component.ts file:

   <app-alert-banner />

3. Test the application.

   You should see the banner displayed in both components.