Thiên Thái Blog

AngularJS là ngôn ngữ lập trình phát triển hoàn toàn dựa trên HTML và JavaScript, vì vậy không cần phải tìm hiểu một cú pháp hoặc ngôn ngữ khác. Bài viết dưới đây sẽ trả lời các câu hỏi: AngularJS là gì?, tính năng, ưu – nhược điểm và các thành phần của AngularJS.

1. AngularJS là gì ?

AngularJS là một framework javascript với mã nguồn mở được sử dụng để tạo các ứng dụng trang web động. Nó cho phép bạn sử dụng HTML làm ngôn ngữ mẫu của bạn và cho phép bạn mở rộng cú pháp HTML để thể hiện rõ các thành phần của ứng dụng của bạn.

AngularJS thay đổi HTML tĩnh thành HTML động. Nó mở rộng khả năng của HTML bằng cách thêm các thuộc tính và thành phần dựng sẵn và cũng cung cấp khả năng tạo các thuộc tính tùy chỉnh bằng cách sử dụng JavaScript đơn giản.

Các mục tiêu thiết kế của AngularJS bao gồm:

Để phân tách thao tác DOM khỏi logic ứng dụng. Điều này bị ảnh hưởng đáng kể bởi cách mã được cấu trúc.
Để tách rời ứng dụng từ phía máy chủ, điều này cho phép công việc phát triển được tiến hành song song và cho phép tái sử dụng cả hai phía.
Cung cấp cấu trúc xây dựng một ứng dụng: từ thiết kế giao diện người dùng, viết logic nghiệp vụ, đến thử nghiệm.

2. Các tính năng chính của AngularJS

Các tính năng chính của AngularJS là:

Data-binding: Nó tự động đồng bộ hóa dữ liệu giữa thành phần model và view.
Scope: Scope đề cập đến mô hình ứng dụng, nó hoạt động như cầu nối giữa controller và view. Scope được sắp xếp theo cấu trúc phân cấp và cấu trúc DOM của ứng dụng. Nó có thể xem biểu thức và truyền các sự kiện.
Controller: Đây là những tính năng của AngularJS mà được giới hạn tới một scope cụ thể.
Model View Whatever: MVC là một mô hình thiết kế để phân chia các ứng dụng thành nhiều phần khác nhau (gọi là Model, View và Controller), một phần sử dụng với một nhiệm vụ nhất định. AngularJS không triển khai MVC theo cách truyền thống, mà gắn liền hơn với Model-View-ViewModel. Nhóm phát triển AngularJS đã đặt tên vui cho mô hình này là Model View Whatever.
Services: Trong các services AngularJS là các đối tượng singleton hoặc các hàm được sử dụng để thực hiện các nhiệm vụ cụ thể. Nó nắm giữ một số logic và chức năng này có thể được gọi là bộ điều khiển, chỉ thị, bộ lọc.
Data Binding: Tự động đồng bộ hóa dữ liệu giữa các thành phần mô hình và khung được gọi là ràng buộc dữ liệu trong AngularJS. Có hai cách để ràng buộc dữ liệu:

Khai thác dữ liệu trong các hệ thống mẫu cổ điển.
Ràng buộc dữ liệu trong các mẫu.

Directives: Một chỉ thị trong AngularJS là một lệnh cung cấp chức năng HTML mới. Khi nhìn qua mã HTML, đầu tiên ta sẽ tìm thấy các chỉ thị trong trang và sau đó phân tích cú pháp trang HTML cho phù hợp. Lưu ý: Bạn có thể có mã góc cơ bản trong một trang HTML với chỉ thị ng-init, ng-repeat và ng-model mà không cần phải có Controllers. Logic cho các chỉ thị này nằm trong tệp Angular.js do Google cung cấp.
Filters: Để định dạng dữ liệu trước khi hiển thị, bạn có thể sử dụng bộ lọc, nó lựa chọn (hay là lọc) các tập con từ tập item trong các mảng và trả về các mảng mới.
Deep Linking: Cho phép bạn mã hóa trạng thái các ứng dụng trên địa chỉ URL để nó có thể được bookmark. Các ứng dụng có thể được phục hồi lại từ các địa chỉ URL với cùng một trạng thái.
Dependency Injection: AngularJS có sẵn một hệ thống con dependency injection để giúp các lập trình viên tạo ra các ứng dụng dễ phát triển, dễ hiểu và kiểm tra.

3. Ưu điểm của AngularJS

Khung MVC JavaScript nguồn mở.
Được hỗ trợ bởi Google
Không cần phải học một ngôn ngữ kịch bản khác. Nó chỉ là JavaScript và HTML thuần túy.
Các thuộc tính tích hợp (các chỉ thị) làm cho HTML động.
Dễ dàng mở rộng và tùy chỉnh.
Hỗ trợ ứng dụng đơn trang.
Sử dụng Injection Dependency.
Dễ dàng để kiểm tra đơn vị.
Hỗ trợ hai chiều ràng buộc dữ liệu
Hỗ trợ dịch vụ REST đầy đủ
Với AngularJS, lập trình viên sẽ viết ít code hơn, với nhiều chức năng hơn.

Và trên tất cả, ứng dụng AngularJS có thể chạy trên hết các trình duyệt web, trên các nền tảng Android và IOS.

4. Nhược điểm của AngularJS

Với rất nhiều những ưu điểm trên thì Angular JS cũng có một số những hạn chế nhỏ nhất định.

Là một JavaScript framework, ứng dụng được viết bởi AngularJS không an toàn. Phải có các tính năng bảo mật và xác thực phía server sẽ giúp ứng dụng trở nên an toàn hơn.
Nếu người sử dụng ứng dụng của bạn vô hiệu hóa JavaScript thì họ chỉ nhìn được trang cơ bản, không thấy gì thêm.

5. Các thành phần của AngularJS

Có 3 thành phần chính phải được kể tới đó là:

ng-app: Các ng-app chỉ thị AngularJS rằng đây là phần tử gốc của ứng dụng AngularJS. Tất cả các ứng dụng AngularJS phải có phần tử gốc. Bạn chỉ có thể có một ng-app chỉ thị trong tài liệu HTML của mình. Nếu có nhiều hơn một ng-app chỉ thị xuất hiện, liên kết đầu tiên sẽ được sử dụng.
ng-model: Chỉ thị ng-model liên kết giá trị của các điều khiển HTML (đầu vào, chọn, văn bản) với dữ liệu ứng dụng. Với ng-model, bạn có thể liên kết giá trị của trường đầu vào với biến được tạo trong AngularJS.
ng-bind: Các ng-bind AngularJS để thay thế nội dung của một phần tử HTML với giá trị của một biến, hoặc biểu hiện nhất định. Nếu giá trị của biến hoặc biểu thức thay đổi thì nội dung của phần tử HTML được chỉ định cũng sẽ được thay đổi.

Nguồn: https://www.devpro.edu.vn/