Angular.js 컨트롤러 파라미터의 이해

Angular.js 컨트롤러 파라미터의 이해

이제 막 Angular.js를 배우기 시작했는데 Angular 홈페이지의 "Wire up a Backend" 예제의 project.js를 살펴보고 있습니다.

컨트롤러 기능의 매개 변수가 헷갈립니다.

function ListCtrl($scope, Projects) {
  ... 
}   

function CreateCtrl($scope, $location, $timeout, Projects) {
  ... 
}

function EditCtrl($scope, $location, $routeParams, angularFire, fbURL) {
   angularFire(fbURL + $routeParams.projectId, $scope, 'remote', {}).
   then(function() {
     ...
   });
}  

이러한 컨트롤러 함수는 routeProvider에서 호출되지만 파라미터는 모두 제공되지 않습니다.

$routeProvider.
  when('/', {controller:ListCtrl, templateUrl:'list.html'}).
  when('/edit/:projectId', {controller:EditCtrl, templateUrl:'detail.html'}).
  when('/new', {controller:CreateCtrl, templateUrl:'detail.html'}).
  otherwise({redirectTo:'/'});
});

현재 상황을 설명할 수 있는 유일한 것은 "Injection Services Into Controller(컨트롤러에 서비스 주입"뿐입니다.$location,$timeout, 파라미터 메서드, ,, 에미, 에단은 없습니다.angularFire ★★★★★★★★★★★★★★★★★」fbURL.

구체적인 질문은 다음과 같습니다.

1. 컨트롤러 파라미터는 무엇입니까?

2. 컨트롤러 기능은 어디에서 파라미터와 함께 호출됩니까?또는 파라미터는 호출되지 않고 다수의 Angular.js 매직으로 어소시에이션이 발생하는 컨트롤러와 관련된 것일 뿐입니다(그렇다면 github에서 소스 코드를 확인할 수 있습니까).

3. 「 」는 어디에 ?angularFire의되되??? ???

4. 요?fbURL다음과 같이 합니다.

   angular.module('project', ['firebase']).
       value('fbURL', 'https://angularjs-projects.firebaseio.com/').
       factory ...
   

5. 서비스를 볼 수를 들어, 「 」 「 」 「 」 「 」 「 」 「 」 등$location ★★★★★★★★★★★★★★★★★」$timeout.js의 목록 (본격적으로)

• 컨트롤러 파라미터는 무엇입니까?

  컨트롤러 파라미터는 Angular에 의해 주입되는 의존관계입니다.JS 인젝터 서비스.그들은 무엇이든 될 수 있다.단, 일반적으로 컨트롤러 내부에서 사용되는 서비스입니다.

• 컨트롤러 기능은 어디에서 파라미터와 함께 호출됩니까?

  컨트롤러, 디렉티브, 필터, 서비스 등 Angular의 많은 것JS는 함수입니다.그러나 프레임워크는 이러한 기능의 호출 시기와 방식을 관리합니다.

  관련지어져 있는 물건에는 위에서 설명한 바와 같이 의존성이라는 이름이 있습니다.네가 마법이라고 부르는 건 앵귤러야JS 의존성 주입 메커니즘이 작동 중입니다.

  인젝터에 를 들어 " " " ( " " " )을 .$scope ★★★★★★★★★★★★★★★★★」$http ★★★★★★★★★★★★★★★★★」angularFire 그 해, 및 해당 이름의 등록된 서비스를 검색합니다.이 서비스는 함수가 호출될 때 파라미터로 제공됩니다.

  그것은 간단하다.인젝터에 대한 "의존성"(인젝터에 의해 관리되는 파라미터)에 대해 지시할 수 있는 몇 가지 방법이 있습니다.

  을 「 「 」라고하는 경우.function myCtrl($scope) {}가 ' 수중에 있다, 하다, 하다.$scopeservice를 지정합니다.그러나 JavaScript 코드를 최소화하면 파라미터 이름이 "a" 또는 "x"와 같은 작은 문자열로 수정되기 때문에 인젝터는 더 이상 서비스를 찾을 수 없습니다.이 문제를 피하기 위해 어레이 표기법을 사용하여 주입할 서비스 이름을 지정할 수 있습니다.이 경우 다음과 같이 함수를 선언합니다.myCtrl = ['$scope', function($scope) {}]

  Angular에서 많은 배열 표기법을 볼 수 있습니다.JS월드이제 너도 이해하기 시작했구나.심지어 주사도 할 수 있고$scope ★★★★★★★★★★★★★★★★★」angularFire기능에서 다른 이름과 함께 사용할 수 있습니다(이름 변경은 권장되지 않습니다.다음 예는 학습 목적으로 기재되어 있습니다. ['$scope', 'angularFire', function(skop, af) {}]- 이렇게 함수에 $scope를 "skop"으로, angularFire를 "af"로 사용할 수 있습니다.어레이의 서비스 순서가 매개 변수의 순서와 일치합니다.

또 다른 예는 다음과 같습니다.

var myController = ['$scope', '$resource', '$timeout',
    function($scope, $resource, $timeout) {
        // this controller uses $scope, $resource and $timeout
        // the parameters are the dependencies to be injected
        // by AngularJS dependency injection mechanism
    }
];

• angular Fire는 어디에 정의됩니까?

  파이어베이스 모듈.

  이미 알고 있듯이 인젝터는 레코드에 "thing" 이름이 등록되고 사용 가능한 한 모든 것을 주입합니다.그 이름의 서비스가 있다면, 그는 그것을 제공할 수 있다.

  이 '아예'는 요?name => stuff떤떤인 ?젝 ?? ????

  모듈이 정답입니다.모듈은 다음 목록에 불과합니다.name => stuff서비스, 공장, 필터, 디렉티브 등을 등록할 수 있는 모듈입니다.

  공식 문서에서 모듈 방법을 주의 깊게 살펴보십시오.이름 및 일부 "stuff"(여기서 "stuff"는 거의 항상 컨트롤러, 공장 또는 명령을 정의하는 함수)를 매개 변수로 수신합니다.이 모든 "물건"이 그들의 특정한 이름을 통해 주입될 것이다.

  ng 모듈이 프레임워크에 의해 이미 로드되어 있기 때문에 "$timeout", "$http" 등의 AngularJS 서비스를 기본적으로 사용할 수 있습니다.

  추가 서비스의 경우 모듈을 로드/요구해야 합니다.그게 바로 ngRouter, Firebase 등...모듈을 로드하면 등록된 것을 모듈/앱에 주입할 수 있습니다.

다음으로 단계별 예를 제시하겠습니다.

// An empty module:
var module = angular.module('myModule', []);

// Now, adding an "injectable" constant: 
module.constant('niceStuff', { blip: 'blop', blup: 307 });

// We could add a service:
module.service('entityManager', ['$http', function($http){  }]);

// and so on... if I wanted to use "$resource" instead of "$http"
// in the entityManager service above...
// ...I would need to require the ngResource when creating the module above,
// like this: var module = angular.module('myModule', ['ngResource']);
// because "$resource" is not available by default

// NOW, anywhere else, since the code above already ran
// I can use those NAMES as dependencies like this:

// We are creating another module now:
var koolModule = angular.module('km', ['myModule']);
// Note that I am requiring the previous module through its registered name

// Now, anything I've declared in that module
// - just like "ng" (by default) and "firebase" (required) does -
// is available for "injection"!!!

koolModule.controller('koolController',
    ['niceStuff', 'entityManager', function(niceStuff, entityManager) {
        console.log(niceStuff.blip);      // 'blop'
        console.log(niceStuff.blup + 10); // 317
    }]
);

이것이 angularFire와 같은 파이어베이스가 이용 가능하게 되는 방법입니다!슨슨 짓을 ???myModule 만를NAMED 。 후, 「 Module에 「 Module는 이미 「kool Module」 「my Module」로할 수 있게 되었습니다.name => stuff참조해 주세요.

• 파라미터의 fbURL을 링크하는 방법

  앞에서 설명한 바와 같이 대부분의 모듈 방식에서는 사물을 등록하는 데 그치고 사물에 이름을 붙여 나중에 이러한 이름을 삽입하거나 사용할 수 있습니다.

  module.value('fbURL', 'https://angularjs-projects.firebaseio.com/')fbURL(및 지정된 값)이 에 등록됩니다.name => stuff이 경우 이름은 "fbURL"이고 값/stuff는 URL 문자열입니다. 단, 어떤 것이든 상관없습니다.

• Angular.js가 제공하는 $location 및 $timeout 등의 모든 서비스를 볼 수 있는 장소가 있습니까?

  네, API 레퍼런스 http://docs.angularjs.org/api/

  좌측 내비게이션이 어떻게 구성되어 있는지 주의하세요.모듈로!첫째, ng 모듈, 수많은 지침, 서비스, 필터 등이 있습니다.그 후, 아래에 다른 모듈(ngRoute, ngResource, ngMock 등)은 각각 독자적인 서비스, 피팅러 또는 디렉티브를 포함하고 있습니다.

이러한 생각을 공유할 기회를 주셔서 감사합니다.나는 그것들을 쓰는 것을 즐겼다.

일단 이 틀을 잘 골랐습니다.최고입니다.$ 기호가 표시된 변수는 표준 프레임워크의 일부로 삽입됩니다.이 서비스들은 당신의 삶을 훨씬 더 편하게 해줄 것입니다.컨트롤러를 생각할 수 있는 가장 좋은 방법은 스크립트 시트입니다.암호를 분리하는 데 도움이 됩니다.그것들을 방법이라고 생각하지 마세요.$timeout이나 $scope와 같은 변수는 특정 작업을 수행해야 할 때 유용한 서비스입니다.프레임워크의 모든 매뉴얼은 http://docs.angularjs.org/api/에 있습니다.이 튜토리얼은 http://docs.angularjs.org/tutorial/부터 시작하겠습니다.

각화는 프레임워크의 일부가 아닙니다.강력한 실시간 분산 네트워크를 구축하기 위해 이 프레임워크를 활용하는 또 다른 서비스입니다.angularfirejs를 로드하면 서비스와 함께 제공되며, 이 서비스는 표시된 파라미터로 주입됩니다.

두 번째 질문에 답하기 위해 전달되는 파라미터는 대응하는 서비스를 제공하는 한 어떤 것이든 상관없습니다.컨트롤러에 대한 자체 파라미터를 작성하려면 http://docs.angularjs.org/guide/dev_guide.services.creating_services 를 참조하십시오.

fbURL은 사용자가 만들 수 있는 변수일 뿐이며, 질문에 입력한 코드는 단순히 만드는 방법에 대한 지시입니다.

Angularjs는 무엇을 제공하는지 보고 배울 수 있는 유형의 프레임워크가 아닙니다.단지 모든 것을 제공한다는 이유만으로.좋은 앱을 만들기 위해 가지고 갈 수 있는 모든 것.대신 구글에게 각도로 문제를 해결하는 방법을 물어보는 데 집중해야 합니다.

유튜브에서 동영상도 확인하세요.당신은 좋은 것들을 찾을 수 있을 거예요.

toxaq 코멘트에 따라 답변으로 코멘트를 드리겠습니다.

1. 컨트롤러 파라미터는 무엇입니까?

   서비스, 공장, 값, 상수 등이 대부분입니다.또는 루트 정의에서 resolve를 사용하여 정의한 값입니다.

2. 컨트롤러 기능은 어디에서 파라미터와 함께 호출됩니까?

   컨트롤러를 정의하는 적절한 방법은 다음과 같습니다.

   angular.module('project').controller('EditCtrl', [
       '$scope', 
       '$location', 
       '$routeParams', 
       'angularFire', 
       'fbURL', 
       function($scope, $location, $routeParams, angularFire, fbURL) { 
           ... 
       } 
   ]); 
   

   이렇게 하면 먼저 삽입할 서비스의 이름을 설정한 후 필요에 따라 해당 서비스에 다른 이름을 지정할 수 있습니다.실제로 나중에 각도 코드를 최소화하는 경우(최소화를 통해 변수의 이름이 변경되므로 각도가 서비스 이름을 찾을 수 있어야 합니다).

3. angular Fire는 어디에 정의됩니까?

   프로젝트 모듈을 정의할 때 방화벽 모듈 종속성도 포함되었습니다.파이어베이스 모듈 내부에는 이전 fbURL과 같은 angularFire 서비스가 있어야 합니다.

4. 파라미터의 fbURL은 어떻게 링크됩니까?

   아시다시피 컨트롤러의 파라미터는 컨트롤러의 정의에서 각도로 주입됩니다.Angular는 등록된 모든 서비스를 검색하여 지정된 파라미터 이름의 일치를 찾아 해당 서비스를 주입합니다.

5. Angular.js가 제공하는 $location 및 $timeout 등의 모든 서비스를 볼 수 있는 장소가 있습니까?

   Angular에 포함된 모든 내장 서비스, 필터, 디렉티브 목록은 API를 참조하십시오.http://docs.angularjs.org/api

컨트롤러 기능은 어디에서 파라미터와 함께 호출됩니까?

컨트롤러 기능은 ngController 디렉티브에 의해 인스턴스화 됩니다.또는 루트 작성 중에 컨트롤러가 언급되어 있는 경우$routeProvider 하며 JS를 하여 컨트롤러에서 정의한 를 삽입합니다.DI

DI는 파라미터의 이름(또는 몇 번인가의 순서)을 대조하는 것으로 동작합니다. ★★★★★★★★★★★★★★★★★.$scope의 스코프인 「현재의 스코프」를 합니다.$http는 http 를 합니다.

언급URL : https://stackoverflow.com/questions/19238191/understanding-angular-js-controller-parameters