Hot to set common processing of the header

I want to display a logout button in the header at the top of the page, if it is a login user.
If user is not logged in I want to display the login button.

Headers are always displayed on any page.

The login status confirmation process is described in all page type scripts.

Also, the design of the header is described in the html file of all pages.

Can I make headers into parts and read the parts from each page?
Is it also possible to standardize the process of checking the login status of the header?

Use services and inject it in the app.module : @NgModule.providers array.

The same service instance will be used for each component.