AngularJS là gì?
AngularJS là một khung Model-View-Controller mã nguồn mở, tương tự như khung JavaScript.
Angular JS có lẽ là một trong những khung công tác web hiện đại phổ biến nhất hiện nay. Khung này được sử dụng để phát triển hầu hết các ứng dụng Trang đơn. Khung này đã được phát triển bởi một nhóm các nhà phát triển từ chính Google.
Do có sự hỗ trợ tuyệt đối của Google và các ý tưởng từ một diễn đàn cộng đồng rộng lớn, nên khuôn khổ này luôn được cập nhật. Ngoài ra, nó luôn kết hợp các xu hướng phát triển mới nhất trên thị trường.
Trong hướng dẫn này, bạn sẽ học-
- Tính năng AngularJS
- Kiến trúc Angularjs
- Ưu điểm của AngularJS
Tính năng AngularJS
Angular có các tính năng chính sau đây khiến nó trở thành một trong những framework mạnh mẽ trên thị trường.
-
MVC - Khung công tác được xây dựng dựa trên khái niệm nổi tiếng về MVC (Model-View-Controller). Đây là một mẫu thiết kế được sử dụng trong tất cả các ứng dụng web ngày nay. Mô hình này dựa trên việc chia lớp logic nghiệp vụ, lớp dữ liệu và lớp trình bày thành các phần riêng biệt. Việc phân chia thành các phần khác nhau được thực hiện để mỗi phần có thể được quản lý dễ dàng hơn.
-
Liên kết mô hình dữ liệu - Bạn không cần phải viết mã đặc biệt để liên kết dữ liệu với các điều khiển HTML. Điều này có thể được thực hiện bởi Angular chỉ bằng cách thêm một vài đoạn mã.
-
Viết ít mã hơn - Khi thực hiện thao tác DOM, cần phải viết nhiều JavaScript để thiết kế bất kỳ ứng dụng nào. Nhưng với Angular, bạn sẽ ngạc nhiên với số lượng mã ít hơn bạn cần viết để thao tác DOM.
-
Kiểm thử đơn vị đã sẵn sàng - Các nhà thiết kế tại Google không chỉ phát triển Angular mà còn phát triển một khung kiểm thử có tên "Karma" giúp thiết kế các kiểm thử đơn vị cho các ứng dụng AngularJS.
Kiến trúc AngularJS
Angular.js tuân theo kiến trúc MVC, sơ đồ của khung MVC như hình dưới đây.
-
Bộ điều khiển đại diện cho lớp có logic nghiệp vụ. Sự kiện người dùng kích hoạt các chức năng được lưu trữ bên trong bộ điều khiển của bạn. Các sự kiện người dùng là một phần của bộ điều khiển.
-
Chế độ xem được sử dụng để đại diện cho lớp trình bày được cung cấp cho người dùng cuối
-
Mô hình được sử dụng để đại diện cho dữ liệu của bạn. Dữ liệu trong mô hình của bạn có thể đơn giản như chỉ có các khai báo nguyên thủy. Ví dụ: nếu bạn đang duy trì ứng dụng dành cho sinh viên, thì mô hình dữ liệu của bạn có thể chỉ có id và tên sinh viên. Hoặc nó cũng có thể phức tạp do có một mô hình dữ liệu có cấu trúc. Nếu bạn đang duy trì đơn đăng ký sở hữu ô tô, bạn có thể có các cấu trúc để xác định chính chiếc xe đó về dung tích động cơ, chỗ ngồi, v.v.
Ưu điểm của AngularJS
-
Vì đây là một khung công tác mã nguồn mở, bạn có thể mong đợi số lỗi hoặc sự cố là tối thiểu.
-
Liên kết hai chiều - Angular.js giữ cho lớp dữ liệu và bản trình bày được đồng bộ hóa. Giờ đây, bạn không cần phải viết thêm mã JavaScript để giữ dữ liệu trong mã HTML và dữ liệu của bạn sau này được đồng bộ hóa. Angular.js sẽ tự động làm điều này cho bạn. Bạn chỉ cần chỉ định điều khiển nào bị ràng buộc với phần nào của mô hình của bạn.
-
Định tuyến - Angular có thể đảm nhận việc định tuyến có nghĩa là di chuyển từ chế độ xem này sang chế độ xem khác. Đây là điều cơ bản quan trọng của các ứng dụng trang đơn; trong đó bạn có thể chuyển sang các chức năng khác nhau trong ứng dụng web của mình dựa trên sự tương tác của người dùng nhưng vẫn ở trên cùng một trang.
-
Angular hỗ trợ kiểm tra, cả Kiểm thử đơn vị và Kiểm thử tích hợp.
-
Nó mở rộng HTML bằng cách cung cấp các phần tử của riêng nó được gọi là chỉ thị. Ở cấp độ cao, chỉ thị là các điểm đánh dấu trên phần tử DOM (chẳng hạn như thuộc tính, tên phần tử và nhận xét hoặc lớp CSS) yêu cầu trình biên dịch HTML của AngularJS đính kèm một hành vi được chỉ định vào phần tử DOM đó. Các chỉ thị này giúp mở rộng chức năng của các phần tử HTML hiện có để cung cấp thêm sức mạnh cho ứng dụng web của bạn.