VANHIEP.NET - Làm web giá rẻ - Thiết Kế Website - Thiết Kế Ứng Dụng Mobile
tổng hợp kiến thức angularjs cơ bản

Tổng hợp kiến thức cơ bản nhất về angularjs

Thứ hai, Ngày 18/01/2021 22:08

- Để làm việc với thư viện angularjs ta cần nhúng thư viện vào

- Thêm ng-app ở vùng làm việc

 

- Thêm ng-contronller ở vùng mà controller cần xử lý

 

 

- Để in dữ liệu angularjs dùng {{ Name }}

 

Danh Sách Sinh Viên {{ hoten }}

 

Lưu ý : nếu dùng angularjs trong dự án laravel thì xóa .blade của laravel, chỉ để Filename.php và in dữ liệu như php thuần, cách làm này để sử dụng dấu {{ }} của angular không bị xung đột với laravel.

- Để lặp dữ liệu angularjs dùng ng-repeat

 

- In các phần tử con trong vòng lặp dùng như sau

{{ sv.name }}

- Khi click vào button cần gọi hàm xử lý angularjs dung ng-click

ng-click="modal('edit',sv.id)"

edit: là status của hàm

sv.id : là dữ liệu truyền vào hàm

- Để lấy dữ liệu từ thẻ input angularjs dùng ng-model 

ng-model="sinhvien.name"

- Để bắt lỗi trong form nhập liệu angularjs dùng ng-required

ng-required="true"

Lưu ý : trong ô nhập liệu để bắt được lỗi thì nhất thiết phải có cả ng-model và ng-required

- Để hiện thị thông báo lỗi trên form angularjs dùng ng-show

Vui lòng nhập email

Đây không phải là định dạng Email

Lưu ý : các thông số error tham khảo trên trang chủ angularjs https://docs.angularjs.org/guide/forms#modifying-built-in-validators

form tham khảo:

Size (integer 0 - 10): {{size}}
The value is not a valid integer! The value must be in range 0 to 10!
Username: {{name}}
Checking if this name is available... This username is already taken!

 

- Chỉnh lại form validate angularjs dùng contentEditable :

Some

model = {{content}}

 

- Để tắt nút button angularjs dùng 

ng-disabled="frmSinhVien.$invalid"

- Để code gọn gang dễ nhìn thì tách controller xử lý phần nào ra phân đó thành file riêng rồi chèn link vào

<script type="text/javascript" src="<?php echo asset('public/app/app.js'); ?>"></script>
<script type="text/javascript" src="<?php echo asset('public/app/controllers/SinhVienController.js'); ?>"></script>

Bài viết liên quan