Angular의 $injector 객체에 대한 간략한 설명

이 글에서는 Angular 의존성 주입 객체인 $injector에 대해 알아 보겠습니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.

$injector는 실제로 .module() 및 $provide를 통해 생성하는 많은 모듈과 서비스를 포함하는 IOC 컨테이너입니다. $injector 서비스는 의존성 주입기 ​​객체에 대한 액세스를 제공합니다. 물론, 주입기를 얻기 위해 angle.injector()를 호출할 수도 있습니다. [관련 추천: "angular Tutorial"]

var injector1 = angular.injector(["myModule","herModule"]); //获得myModule和herModule模块下的注入器实例

angular.injector()는 여러 번 호출될 수 있으며 매번 새로 생성된 인젝터 객체를 반환하므로 우리가 직접 만든 myInjector와 Angle에서 자동으로 생성한 $injector는 그렇지 않습니다. 같은 개체.

    var injector1 = angular.injector(["myModule","herModule"]);  
    var injector2 = angular.injector(["myModule","herModule"]);  
      
    alert(injector1 == injector2);//false

$injector의 자주 사용되는 메소드

$injector.get('serviceName')을 통해 이름을 기반으로 서비스의 인스턴스를 가져오고, $injector.annotate('xxx')를 통해 xxx의 모든 종속성을 가져옵니다. ).

var app = angular.module("myApp",[]);
  app.factory("hello1",function(){
    return {
      hello:function(){
        console.log("hello1 service");
      }
    }
  });
  app.factory("hello2",function(){
    return {
      hello:function(){
        console.log("hello2 service");
      }
    }
  });
 
  var $injector = angular.injector(['myApp']);
  console.log(angular.equals($injector.get('$injector'),$injector));//true
  var myCtrl2 = function($scope,hello1,hello2){
    $scope.hello = function(){
      hello1.hello();
      hello2.hello();
    }
  }
  myCtrl2.$injector = ['hello1','hello2'];
  app.controller("myCtrl2", myCtrl2);
  console.log($injector.annotate(myCtrl2));//["$scope","hello1","hello2"]

Angular에서 종속성을 선언하는 세 가지 방법

.controller() 함수를 사용하면 $controller 서비스가 호출되고, 최하위 수준에서는 $injector 서비스의 호출() 함수가 호출됩니다. Controller를 생성하는 데 사용되는 Invoke() 함수는 컨트롤러에 전달되어야 하는 매개 변수를 분석하고 함수를 실행하는 역할을 담당하므로 맨 아래 계층에서는 실제로 다음 세 가지 방법을 사용하여 종속성을 선언합니다.

    // 创建myModule模块、注册服务  
    var myModule = angular.module('myModule', []);  
    myModule.service('myService', function() {  
                this.my = 0;  
    });  
      
    // 获取injector  
    var injector = angular.injector(["myModule"]);  
      
    // 第一种inference（推断）
    injector.invoke(function(myService){alert(myService.my);});  
      
    // 第二种annotation （注入）
    function explicit(serviceA) {alert(serviceA.my);};  
    explicit.$inject = ['myService'];  
    injector.invoke(explicit);  
      
    // 第三种inline  （内联）
    injector.invoke(['myService', function(serviceA){alert(serviceA.my);}]);

$scope object

$scope는 서비스가 아니라 로컬이기 때문에 Angular에서 사용하는 방식은 서비스에서 사용하는 방식과 다릅니다. $scope 변수를 올바르게 삽입하기 위한 이론적 실습은 다음과 같습니다. :

 $injector.invoke(function ($scope, $http) {
  	//在这里使用$scope,$http
  },
  null,
  {$scope: {}});

$rootScope object

$rootScope는angularJS가 모듈을 로드할 때 자동으로 생성됩니다. 각 모듈에는 1개의 rootScope만 있습니다. rootScope가 생성되면 서비스 형태로 $injector에 추가됩니다. 즉, $injector.get("$ rootScope ")를 통해 모듈의 루트 범위를 얻을 수 있습니다.

// 新建一个模块
var module = angular.module("app",[]);
 
// true说明$rootScope确实以服务的形式包含在模块的injector中
var hasNgInjector = angular.injector(['app','ng']);  
console.log("has $rootScope=" + hasNgInjector.has("$rootScope"));//true
 
// 获取模块相应的injector对象,不获取ng模块中的服务
// 不依赖于ng模块,无法获取$rootScope服务
var noNgInjector = angular.injector(['app']);
console.log("no $rootScope=" + noNgInjector.has("$rootScope"));//false
 
// 获取angular核心的ng模块
var ngInjector = angular.injector(['ng']);  
console.log("ng $rootScope=" + ngInjector.has("$rootScope"));//true

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 비디오를 방문하세요! !

위 내용은 Angular의 $injector 객체에 대한 간략한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!