Challenge: Adding a Header Using Angular Directives

Complete the challenge of implementing a header using an Angular directive.

Problem statement

You are provided with an initial code setup below. The setup contains an Angular application with a directive header.directive.ts file inside the src/app folder. You are required to implement the following tasks:

  1. Add the directive into the main module file, app.module.ts.

  2. Implement the header using a directive in the application.

  3. Add styling for the header in the style.css file.

  4. Render the header directive in the main application.

Expected output

When you run the application, you should see the output below:

Note: The date and time should be dynamic.

Get hands-on with 1400+ tech skills courses.