Đóng gói Component Styles
Khi chúng ta xây dựng template cho một component, thỉnh thoảng chúng ta sẽ cần những styles duy nhất cho component này. Ví dụ, chúng ta xây dựng một sidebar navigation (thanh điều hướng) component, chúng ta có thể muốn một số styles đặc biệt cho thẻ li hay div, sẽ cần một cách để mang những styles chỉ sử dụng cho component này. Có một cách là chúng ta sẽ định nghĩa trực tiếp những style này vào trong đoạn mã HTML của template. Nhưng như vậy thì sẽ khó để xem, sử dụng lại hay bảo trì những đoạn code chứa style này. Một lựa chọn khác là định nghĩa một file css bên ngoài, điều này sẽ dễ bảo trì code, nhưng chúng ta sẽ phải chắc chắn rằng file css sẽ phải được liên kết ở trong file index.hml. Và như vậy lại khó khăn trong vấn đề sử dụng lại component. Có một cách tốt hơn cả giúp chúng ta giải quyết vấn đề này, component decorator có những thuộc tính để đóng gói những style lại như một phần của component. Những thuộc tính này là “styles” và “styleUrls”.
Với styles và styleUrls, chúng đều cho phép khai báo một mảng những phẩn tử. Do đó chúng ta có thể thêm nhiều hơn một style hay một file stylesheet bên ngoài.
Last updated