AngularJS là gì và ứng dụng như thế nào đến HTML

AngularJS là gì và ứng dụng như thế nào đến HTML

10/04/2021

AngularJS là gì? Nó cho phép bạn mở rộng HTML với các thuộc tính HTML được gọi là directives.

AngularJS directives cung cấp chức năng cho các ứng dụng HTML. Cụ thể hơn, AngularJS cung cấp các directives được xây dựng và người dùng định nghĩa directives

AngularJS directives là gì?

Định nghĩa chính thức giải thích AngularJS là gì được đưa ra như sau :

AngularJS là một framework có cấu trúc cho các ứng dụng web động. Nó cho phép bạn sử dụng HTML như là ngôn ngữ mẫu và cho phép bạn mở rộng cú pháp của HTML để diễn đạt các thành phần ứng dụng của bạn một cách rõ ràng và súc tích.

Hai tính năng cốt lõi: Data binding và Dependency injection của AngularJS loại bỏ phần lớn code mà bạn thường phải viết. Nó hoạt động với tất cả các trình duyệt, làm cho nó trở thành đối tác lý tưởng của bất kỳ công nghệ Server nào.

AngularJS là gì?

Để học được AngularJS bạn cần phải có những kiến thức cơ bản javascript, object, string …. Việc bạn có hiểu biết chuyên sâu về javascript sẽ giúp cho bạn dễ dàng học AngularJS. Bản chất của AngularJS là hoạt động dạng Single Page, sử dụng API để lấy data, cho nên bạn cần biết các kĩ thuật DHTML, AJAX.

 Ví dụ

<div ng-app="" ng-init="message='Hello AngularJS!'">
  <h1>{{ message }}</h1>
</div>

Giải thích về lệnh ng-model Directive

Lệnh ng-model này liên kết giá trị của các phần tử HTML với dữ liệu ứng dụng.

 Ví dụ

<div ng-app="" ng-init="firstName='John'">
  <p>Name: <input type="text" ng-model="firstName"></p>
  <p>You wrote: <b>{{firstName}}</b></p>
</div>
AngularJS là gì
AngularJS là gì

Lệnh ng-bind Directive là gì?

Lệnh ng-bind này liên kết dữ liệu với một model.

 Ví dụ

<div ng-app="" ng-init="firstName='John'">
  <p>Name: <input type="text" ng-model="firstName"></p>
  <p>You wrote <b ng-bind="firstName"></b></p>
</div>

Hy vọng bài viết trên giúp bạn hiểu được AngularJS là gì và ứng dụng nó hiệu quả vào việc mở rộng HTML.

Theo w3schools

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments