화면 분리하기

해드 컴포넌트 생성

ng g component head

바디 컴포넌트 생성

 ng g component body

헤더와 바디 컴포넌트를 메인컴포넌트 파일에 등록(app.component.html)

<app-head></app-head>
<br>
<app-body></app-body>

헤더 셀렉터

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-head',
  templateUrl: './head.component.html',
  styleUrls: ['./head.component.css']
})
export class HeadComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
  }
}

바디 셀렉터

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-body',
  templateUrl: './body.component.html',
  styleUrls: ['./body.component.css']
})
export class BodyComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
  }
}