Angular 15 (2022년 11월 17일)

Angular 15

- Angular 15 공식 발표 (Blog)

- Angular 15 Github 15.0.0

- Angular 15 Release Note

- Angular 15 Upgrade Guide (Check List)

- supported TypeScript version to v4.8

- supported Node.js v14.20.x, v16.13.x, v18.10.x

 

Angular 15 새로운 주요 Features

- Standalone API 가 Preview를 마치고 stable 되었습니다.

- Router 설정 코드가 간결해졌습니다.

- Directive Composition API를 사용가능합니다.

- Image Directive 가 Stable 되었습니다.

- Functional Router Guard가 추가되어 기존에 비 코드가 간결해졌습니다.

- Stack 추적이 개선되어 오류를 파악하는데 더 도움이 됩니다.

- Angular CLI 더욱 개선되었습니다.

 

Breaking Change

- KeyFrame 이름에 범위가 포함됩니다.

- 유효하지 않은 생성자를 DI 로 사용 시 컴파일 오류

- Angular 컴파일 옵션 enableIvy 제거

- @angular/flex-layout 을 중단합니다.

 

Angular v15 Launch Event 🎉 | Live with the Angular Team

 

Router 개선

AS-IS

{
  path: 'lazy',
  loadComponent: () => import('./lazy-file').then(m => m.LazyComponent),
}

 

TO-BE

{
  path: 'lazy',
  loadComponent: () => import('./lazy-file'),
}

 

 

Directive Composition API

 

@Component({
  selector: 'mat-menu',
  hostDirectives: [HasColor, {
    directive: CdkMenu,
    inputs: ['cdkMenuDisabled: disabled'],
    outputs: ['cdkMenuClosed: closed']
  }]
})
class MatMenu {}

 

 

 

 

 

 

Reference

- https://blog.ninja-squad.com/2022/11/16/what-is-new-angular-15.0/

- https://levelup.gitconnected.com/angular-15-new-must-know-features-ae392a2baf2d

- https://www.infoworld.com/article/3680549/angular-15-arrives-with-stable-standalone-apis.html

- https://dev.to/sandeepbalachandran/angular-15-features-22dc