AngularJS - Dependency Injection - Amzuni - Học lập trình trực tuyến

AngularJS – Dependency Injection: Quản lý phụ thuộc trong ứng dụng

Dependency Injection (DI) là một kỹ thuật trong AngularJS giúp quản lý các phụ thuộc giữa các đối tượng trong ứng dụng. Nó giúp tạo ra các ứng dụng mô đun hóa, dễ bảo trì và dễ kiểm thử.

Cơ chế hoạt động

Module: Một module là một container chứa các component như controllers, directives, services, filters.
Dependency: Một dependency là một đối tượng mà một component cần để hoạt động.
Provider: Một provider là một đối tượng được sử dụng để tạo ra các đối tượng khác.
Injector: Một injector là một đối tượng chịu trách nhiệm tạo ra các đối tượng và cung cấp chúng cho các component.

Khi một component được tạo, AngularJS sẽ sử dụng injector để tạo ra các dependency cần thiết và cung cấp chúng cho component đó.

Cách sử dụng Dependency Injection

Khai báo dependency: Trong hàm constructor của component, khai báo các dependency dưới dạng tham số.
AngularJS sẽ tự động tiêm dependency: AngularJS sẽ sử dụng injector để tạo ra các dependency và cung cấp chúng cho component.

JavaScript

angular.module('myApp', [])
  .controller('MyController', function($scope, $http) {
    // $scope và $http là các dependency được tiêm tự động
  });

Các loại Dependency

Value: Một giá trị đơn giản.
Factory: Một hàm trả về một đối tượng.
Service: Một factory được đăng ký dưới dạng service.
Provider: Một đối tượng được sử dụng để tạo ra các đối tượng khác.

Ví dụ: Sử dụng Service

JavaScript

angular.module('myApp', [])
  .service('GreetingService', function() {
    this.greet = function(name) {
      return 'Xin chào, ' + name + '!';
    };
  })
  .controller('MyController', function($scope, GreetingService) {
    $scope.name = 'World';

    $scope.greeting = GreetingService.greet($scope.name);
  });

Ưu điểm của Dependency Injection

Mô đun hóa: Tách các component thành các khối nhỏ hơn, dễ quản lý.
Tái sử dụng: Các component có thể được tái sử dụng trong nhiều phần của ứng dụng.
Kiểm thử: Dễ dàng kiểm thử các component bằng cách cung cấp các mock object.
Độc lập: Các component trở nên độc lập với nhau, giảm sự phụ thuộc.

Các ứng dụng của Dependency Injection

Tạo các ứng dụng mô đun hóa.
Tăng tính bảo trì và khả năng mở rộng của ứng dụng.
Kiểm thử dễ dàng hơn.

AngularJS – Dependency Injection