AngularJS : 종속성 추가 (인라인 배열 대 삽입)

Question

그래서 GitHub (https://github.com/spring-projects/spring-boot)에서 스프링 부트 프로젝트를 발견했습니다. 앱을 사용하면 설명과 함께 항목 목록을 만들 수 있습니다. 목록의 항목도 삭제하는 기능이 있습니다. 이 프로젝트는 AngularJS를 사용하여 SPA (단일 페이지 응용 프로그램)에 자신을 노출하려는 시도였습니다.

이 코드는 injection을 사용하여 정의 된 컨트롤러와 팩토리에 종속성을 추가합니다.

1. : 이제

   var AppController = function($scope, Item) { 
       Item.query(function(response) { 
        $scope.items = response ? response : []; 
       }); 
   
       $scope.addItem = function(description) { 
        new Item({ 
        description: description, 
        checked: false 
        }).$save(function(item) { 
        $scope.items.push(item); 
        }); 
        $scope.newItem = ""; 
       }; 
   
       $scope.updateItem = function(item) { 
        item.$update(); 
       }; 
   
       $scope.deleteItem = function(item) { 
        item.$remove(function() { 
        $scope.items.splice($scope.items.indexOf(item), 1); 
        }); 
       }; 
       }; 
   
       AppController.$inject = ['$scope', 'Item']; 
       angular.module("myApp.controllers").controller("AppController", AppController); 
   

   컨트롤러와 공장에 종속성을 추가하는 두 가지 방법이 있습니다 (만약 내가 잘못 날 수정) : 다음은이 구현을 사용 "controller.js"라는 예를 들어 클래스입니다 인라인 배열

2. 암시 주입

내 관점은 내가 코드를 주입 ​​모든 종속성를 사용하여 응용 프로그램을 가지고 다시 쓸 수있을 것 C ontroller와 factory 정의는 인라인 배열 방법론을 사용하여 종속성을 추가하게됩니다. 여기에 인라인 배열을 사용하여 동일한 "controller.js"하지만입니다 :

angular.module("myApp.controllerModule").controller("AppController", ['$scope', 'Item', function($scope, Item){ 
Item.query(function(response) { 
    $scope.items = response ? response : []; 
}); 

$scope.addItem = function(description) { 
    new Item({ 
     description: description, 
     checked: false 
    }).$save(function(item) { 
     $scope.items.push(item); 
    }); 
    $scope.newItem = ""; 
}; 

$scope.updateItem = function(item) { 
    item.$update(); 
}; 

$scope.deleteItem = function(item) { 
    item.$remove(function() { 
     $scope.items.splice($scope.items.indexOf(item), 1); 
    }); 
}; }]); 

내가 그렇게했을 때, 내 코드는 원래의 코드처럼 작동하지 않습니다. 구문 오류인지 또는 여러 스타일의 적용에 중요한 차이가 있는지 여부는 알 수 없습니다. 아무도 왜 이것이 작동하지 않는지 말해 줄 수 있습니까?

Answer 1

두 코드 샘플에서 볼 수있는 유일한 차이점은 모듈 이름입니다. 오류 메시지를 제공하지 않으므로 모듈을 주입해야하는 모든 파일에서 myApp.controllers을 myApp.controllerModule으로 변경하지 않았다고 가정합니다.

Answer 2

ng-annotate이라는 인수 이름에서 이러한 주석을 자동 생성 할 수 있습니다. 이것은 대부분의 프로젝트가 사용해야하는 것입니다. 종속성을 수동으로 복제하는 것은별로 실용적이지 않습니다.