AngularJS에서 \'controller as\' 구문을 사용하는 이유는 무엇입니까?

AngularJS의 "controller as" 구문 이해

소개

AngularJS는 컨트롤러를 정의하는 새로운 구문인 "controller as"를 도입했습니다. 그 목적에 대한 질문입니다. 이 문서의 목표는 이 구문의 근거와 이점을 명확히 하는 것입니다.

Controller as 구문

"controller as" 구문을 사용하면 컨트롤러를 인스턴스화하고 현재 환경의 변수에 할당할 수 있습니다. 범위. 예:

<code class="javascript">controller('InvoiceController as invoice')</code>

이 코드는 Angular에게 InvoiceController의 인스턴스를 생성하고 이를 현재 범위 내의 송장 변수에 저장하도록 지시합니다.

Controller에서 $scope 제거

"controller as" 구문과 눈에 띄는 차이점 중 하나는 컨트롤러 정의에서 $scope 매개변수를 제거한다는 것입니다. 이렇게 하면 더 깔끔하고 간결한 컨트롤러가 가능해집니다.

<code class="javascript">// With $scope
function InvoiceController($scope) {
  // Do something with $scope.qty
}

// With controller as
function InvoiceController() {
  // Do something with this.qty
}</code>

뷰에 별칭 할당

컨트롤러에서 $scope를 제거하면 코드가 단순화되지만 뷰에 별칭을 지정해야 합니다.

<code class="html">// With $scope
<input type="number" ng-model="qty" />

// With controller as
<input type="number" ng-model="invoice.qty" /></code>

controller as 구문의 목적

"controller as" 구문은 주로 다음과 같은 이유로 도입되었습니다.

• $scope 제거: 일부 개발자는 속성 소스를 난독화한다고 생각하여 $scope 구문을 피하는 것을 선호합니다.
• 속성 출처의 명확성: 뷰에서 별칭을 사용하면 어떤 것이 무엇인지 명확해집니다. 속성은 어떤 컨트롤러에 속합니까? 이는 컨트롤러를 중첩할 때 특히 유용합니다.
• 점 규칙 문제 방지: "controller as" 구문은 속성에 액세스하기 어렵게 만들 수 있는 AngularJS의 "점 규칙" 문제를 방지하는 데 도움이 됩니다. 상위 컨트롤러에서. 이를 통해 컨트롤러 속성에 대한 명확하고 계층적인 액세스가 가능합니다.

위 내용은 AngularJS에서 \'controller as\' 구문을 사용하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!