AngularJS – Controllers

AngularJS Controllers: Quản lý dữ liệu và logic

Controllers trong AngularJS là các JavaScript function được liên kết với một phần của DOM. Chúng chịu trách nhiệm quản lý dữ liệu và logic cho phần đó. Controllers thường được sử dụng để:

  • Quản lý dữ liệu: Lưu trữ và cập nhật dữ liệu trong Model.
  • Xử lý sự kiện: Xử lý các sự kiện của người dùng, như click, submit, change.
  • Tương tác với các service: Gọi các service để thực hiện các tác vụ phức tạp hơn.

Tạo một Controller

Để tạo một controller, bạn sử dụng hàm module.controller(). Hàm này nhận hai tham số: tên của controller và một hàm trả về một đối tượng controller.

JavaScript

angular.module('myApp', [])
  .controller('MyController', function($scope) {
    // ... logic của controller
  });

Truyền dữ liệu vào Controller

Bạn có thể truyền dữ liệu vào controller bằng cách sử dụng dependency injection. AngularJS sẽ tự động tiêm các đối tượng cần thiết vào controller.

JavaScript

angular.module('myApp', [])
  .controller('MyController', function($scope, $http) {
    // ... logic của controller
  });

Sử dụng Controller

Để sử dụng một controller, bạn liên kết nó với một phần của DOM bằng attribute ng-controller.

HTML

<div ng-controller="MyController">
  </div>

Ví dụ

JavaScript

angular.module('myApp', [])
  .controller('MyController', function($scope) {
    $scope.name = 'World';
    $scope.showMessage = function() {
      alert('Hello, ' + $scope.name + '!');
    };
  });

HTML

<div ng-app="myApp" ng-controller="MyController">
  <p>Xin chào, {{ name }}!</p>
  <button ng-click="showMessage()">Hiển thị thông báo</button>
</div>

Các tính năng của Controllers

  • Quản lý dữ liệu: Lưu trữ và cập nhật dữ liệu trong Model.
  • Xử lý sự kiện: Xử lý các sự kiện của người dùng, như click, submit, change.
  • Tương tác với các service: Gọi các service để thực hiện các tác vụ phức tạp hơn.
  • Dependency injection: Tự động tiêm các đối tượng cần thiết vào controller.

Các ứng dụng của Controllers

  • Quản lý dữ liệu cho các form.
  • Xử lý các sự kiện của người dùng.
  • Tương tác với các API backend.
  • Điều khiển logic của ứng dụng.

Bạn muốn tìm hiểu sâu hơn về một khái niệm cụ thể nào đó liên quan đến controllers không?