Component là gì ?

Một Angular Component bao gồm một mẫu (template) cái mà sẽ tạo ra giao diện (layout view) cho người dùng, template này được tạo ra từ HTML. Trên trang HTML này, chúng ta sẽ sử dụng Angular Binding và Directives để tăng sức mạnh cho View. Tôi sẽ giới thiệu về Binding và Directive trong những chương sau.

Thêm vào đó, Component sẽ có một Class để chúng ta liên kết với View. Các Class này được tạo ra bằng TypeScript. Class có chứa các thuộc tính và phương thức, cũng tương tự như định nghĩa Class của lập trình hướng đối tượng.

Một phần không thể thiếu khác của Component là Metadata, nó cung cấp thông tin bổ xung cho Angular Component và giúp định nghĩa Class này như một Angular Component. Metadata được định nghĩa bởi một Decorator. Một decorator có thể hiểu đơn giản là phương thức thêm Metadata vào Class.

Dưới đây là một component đơn giản viết bằng Typescript.

@Component({
    selector: 'pm-app',
    template: `
    <div><h1>{{pageTitle}}</h1>
    <div>My first Component</div>
    </div>
    `
})
export class AppComponent {
    pageTitle: string = 'Janeto Training Center'
}