Modifying landing page with Material Toolbar

Before we start making further changes to app.component.ts, let's switch the component to use inline templates and inline styles, so we don't have to switch back and forth between file for a relatively simple component.

  1. Update app.component.ts to use an inline template
  2. Remove app.component.html and app.component.css
src/app/app.component.tsimport { Component } from '@angular/core'@Component({  selector: 'app-root',  template: `    <div style="text-align:center">      <h1>      LocalCast Weather      </h1>      <div>Your city, your forecast, right now!</div>      <h2>Current Weather</h2>      <app-current-weather></app-current-weather>    </div>  `})export class AppComponent {}

Let's start improving our app by implementing an app-wide ...

Get Angular 6 for Enterprise-Ready Web Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.