getting-started

Mở đầu AngularJS

Posted on Updated on

AngularJS là gì?

Là một framework javascript để tạo dynamic web apps (ứng dụng web động). Nó cho phép bạn sử dụng HTML như là template language và cho phép bạn mở rộng cú pháp HTML để trình bày các thành phần ứng dụng một cách rõ ràng và ngắn ngọn. Data Binding và Dependency Injection của AngularJS làm giảm số lượng code mà bạn phải viết (ngắn ngọn hơn). Tất cả nằm trên trình duyệt, giúp bất kỳ công nghệ server nào đều có thể làm việc với nó.

Tại sao lại chọn AngularJS?

  • Tách riêng biệt phần UI và Business logic (theo mô hình MVC)
  • Khả năng thích ứng cao, tự động xử lý mã javascript dựa theo trình duyệt
  • Mã nguồn mở và hoàn toàn miễn phí
  • Khả năng tạo Single Page Application (một trang web hoặc một ứng dụng web mà tất cả các xử lý đều diễn ra trên một trang duy nhất giúp tối ưu hóa băng thông và trải nghiệm người dùng)
  • Dễ dàng unit test
  • Dễ dàng sử dụng lại các component (directive)
  • Thích ứng ới nhiều trình duyệt, giảm số lượng code mà lập trình viên cần viết

Một số khái niệm cơ bản:

  • Scope: là đối tượng để view và controller có thể giao tiếp với nhau
  • Controller: xử lý dữ liệu cho scope
  • Data-binding: tự động đồng bộ dữ liệu giữa view và model
  • Service: là singleton object được tạo 1 lần duy nhất cho mỗi ứng dụng, có thể sử dụng để tổ chức và chia sẻ code trong toàn bộ ứng dụng thông qua DI
  • Filter: format lại giá trị và hiển thị cho người dùng
  • Directive: là các makers (tag, attribute, CSS class,…) trên các phần từ HTML để đính các hành vi xác định cho phần từ hoặc các con của phần tử đó. Một số directive thương sử dụng như ngModel, ngBind, …
  • Template: một thành phần của view, hiện thị thông tin từ controller
  • Routing: chuyển đổi giữa các action trong controller, qua lại giữa các view
  • Deep link: liên kết sâu, cho phép bạn mã hóa trạng thái của ứng dựng trong các URL để nó có thể bookmark với công cụ tìm kiếm. 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 và testing

Các components chính:

  • ng-app: định nghĩa và liên kết một ứng dụng AngularJS tới HTML.
  • ng-model: two-way binding dữ liệu dữ view và controller

Nhược điểm chính:

  • Là framework javascript nên khi vô hiệu hóa javascript trên trình duyệt là tắt điện
  • Khó khăn hơn cho việc SEO (đòi hỏi bot phải đọc đc javascript -_-)

 

Source:

Advertisements