[Bài 1] – Cách tạo một ứng dụng AngularJS

Bạn đang ở bài 1 trong 3 bài của serie AngularJS.

Cách tạo một ứng dụng AngularJS

Chắc các bạn không còn lạ lẫm gì với cụm từ “AngularJS” rồi phải không? Vậy bạn đã biết gì về nó, cũng như những lợi ích mà AngularJS mang lại cho chúng ta khi lập trình web chưa? Hôm nay, BlogIT.vn sẽ giúp bạn hiểu rõ hơn về AngularJS nhé!

AngularJS là một JS framework sẽ giúp bạn xử lý các đối tượng HTML và hiển thị nội dung, trình bày chúng nhanh hơn. Một ví dụ đơn giản cho việc ẩn/hiện một đối tượng theo cách truyền thống bạn phải sử dụng phương thức show()/hide() trỏ đến một selector để điều khiển chúng. Thì với AngularJS, bạn chỉ cần sử dụng ng-show / ng-hide và truyền vào một điều kiện logic thì đã có thể điều khiển chúng rồi.

Vậy AngularJS có dễ cài đặt hay không? Thì câu trả lời là rất dễ nhé!

Bạn chỉ cần truy cập đến: https://angularjs.org/ và chọn phiên bản AngularJS 1.6.x. Bạn có thể download file source js hoặc sử dụng link cdn.

Khái niệm cơ bản

ng-app

Đây là một thuộc tính cơ bản để định nghĩa ứng dụng AngularJS của chúng ta. Một website chỉ có một ng-app duy nhất, nhưng bạn cũng có thể liên kết đến nhiều app phụ bên ngoài nhầm sử dụng lại những tài nguyên đã có sẵn của những app phụ kia.

VD1: 

  • HTML: <html ng-app=”mainApp” ></html>
  • JS: angular.module(‘mainApp‘, [‘subApp1‘, ‘subApp2‘]);

ng-controller

Vẫn là một thuộc tính cơ bản để định nghĩa một vùng xử lý dữ liệu nào đó trong một ứng dụng ng-app. Ở đây, chúng ta sẽ có một khái niệm mới là controller cha và controller con. Nhưng điều đặc biệt là, những controller có thể sử dụng lại những biến, function được định nghĩa ở controller cha, nhưng ngược lại thì không.

VD2:

  • HTML: <div ng-controller=mainApp” ng-controller=”mainCtrl“></div>
  • JS: angular.module(‘mainApp‘, []).controller(‘mainCtrl‘, function(){});

Những lợi ích khi sử dụng AngularJS

  • Quản lý tài nguyên hiệu quả hơn
  • Thiết kế HTML nhỏ gọn, template hóa
  • Có thể nhìn thấy kết quả xử lý của những đoạn script ngay lập tức
  • Dễ dàng lấy kết quả xử lý ở server từ PHP, ASP.NET,…
  • Tạo được những thẻ HTML đặc biệt có khả năng sử dụng lại ở mọi nơi để xử lý hiển thị
  • Còn nhiều và nhiều nữa

Kết luận

AngularJS là một JS framework hay giúp bạn xử lý các vấn đề về form cũng như hiển thị dữ liệu lên website một cách dễ dàng và nhanh chóng.

Mọi câu hỏi của các bạn xin vui lòng để lại comment bên dưới nhé, rất mong nhận được sự ủng hộ của các bạn ở các bài tiếp theo. Thân chào!

Demo

Xem tiếp bài trong serie AngularJS

Bài kế tiếp: [Bài 2] - Cách sử dụng filter trong AngularJS
[Bài 1] – Cách tạo một ứng dụng AngularJS
5 (100%) 1 vote

Bình luận

Hãy trở thành người đầu tiên bình luận!

Thông báo
avatar
wpDiscuz