Warum die Syntax „Controller as' in AngularJS verwenden?

Verstehen der „Controller as“-Syntax von AngularJS

Einführung

AngularJS hat eine neue Syntax zum Definieren von Controllern eingeführt, „Controller as“, die einige Probleme verursacht hat Fragen zu seinem Zweck. Ziel dieses Artikels ist es, die Gründe für diese Syntax und ihre Vorteile zu verdeutlichen.

Controller-as-Syntax

Mit der „Controller-as“-Syntax können Sie einen Controller instanziieren und ihn einer Variablen im Strom zuweisen Umfang. Zum Beispiel:

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

Dieser Code weist Angular an, eine Instanz des InvoiceControllers zu erstellen und diese in der Rechnungsvariablen innerhalb des aktuellen Bereichs zu speichern.

$scope aus Controller entfernen

Ein auffälliger Unterschied zur „Controller as“-Syntax besteht darin, dass der $scope-Parameter aus der Controller-Definition entfernt wird. Dies ermöglicht sauberere und prägnantere Controller:

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

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

Aliase in der Ansicht zuweisen

Das Entfernen von $scope aus dem Controller vereinfacht zwar den Code, erfordert aber die Angabe eines Alias ​​in der Ansicht:

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

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

Zwecke der Controller-as-Syntax

Die „Controller-as“-Syntax wurde hauptsächlich aus folgenden Gründen eingeführt:

• Entfernung von $scope: Einige Entwickler vermeiden lieber die $scope-Syntax, weil sie glauben, dass sie die Quelle von Eigenschaften verschleiert.
• Klarheit der Eigenschaftsherkunft: Durch die Verwendung von Aliasen in der Ansicht wird klar, welche Eigenschaften gehören zu welchem ​​Controller. Dies ist besonders nützlich, wenn Controller verschachtelt werden.
• Vermeidung von Punktregelproblemen: Die Syntax „Controller als“ hilft dabei, Probleme mit der „Punktregel“ von AngularJS zu vermeiden, die den Zugriff auf Eigenschaften erschweren können von übergeordneten Controllern. Es ermöglicht einen klaren und hierarchischen Zugriff auf Controller-Eigenschaften.

Das obige ist der detaillierte Inhalt vonWarum die Syntax „Controller as' in AngularJS verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!