Was ist AngularJS? Architektur & Eigenschaften

Inhaltsverzeichnis:

Anonim

Was ist AngularJS?

AngularJS ist ein Open Source Model-View-Controller-Framework, das dem JavaScript-Framework ähnelt.

Angular JS ist wahrscheinlich eines der beliebtesten modernen Web-Frameworks, die heute verfügbar sind. Dieses Framework wird hauptsächlich für die Entwicklung von Single Page-Anwendungen verwendet. Dieses Framework wurde von einer Gruppe von Entwicklern von Google selbst entwickelt.

Aufgrund der Unterstützung von Google und der Ideen eines breiten Community-Forums wird das Framework immer auf dem neuesten Stand gehalten. Außerdem werden immer die neuesten Entwicklungstrends auf dem Markt berücksichtigt.

In diesem Tutorial lernen Sie:

  • AngularJS-Funktionen
  • Angularjs Architektur
  • AngularJS Vorteile

AngularJS-Funktionen

Angular verfügt über die folgenden Hauptmerkmale, die es zu einem der leistungsstärksten Frameworks auf dem Markt machen.

  1. MVC - Das Framework basiert auf dem berühmten Konzept von MVC (Model-View-Controller). Dies ist ein Entwurfsmuster, das in allen modernen Webanwendungen verwendet wird. Dieses Muster basiert auf der Aufteilung der Geschäftslogikschicht, der Datenschicht und der Präsentationsschicht in separate Abschnitte. Die Unterteilung in verschiedene Abschnitte erfolgt, damit jeder einfacher verwaltet werden kann.

  2. Datenmodellbindung - Sie müssen keinen speziellen Code schreiben, um Daten an die HTML-Steuerelemente zu binden. Dies kann von Angular durch Hinzufügen einiger Codeausschnitte erfolgen.

  3. Weniger Code schreiben - Bei der DOM-Manipulation musste viel JavaScript geschrieben werden, um eine Anwendung zu entwerfen. Mit Angular werden Sie jedoch erstaunt sein, wie wenig Code Sie für die DOM-Manipulation schreiben müssen.

  4. Unit- Test bereit - Die Designer von Google haben nicht nur Angular entwickelt, sondern auch ein Test-Framework namens "Karma", das beim Entwerfen von Unit-Tests für AngularJS-Anwendungen hilft.

AngularJS-Architektur

Angular.js folgt der MVC-Architektur, dem Diagramm des MVC-Frameworks, wie unten gezeigt.

Angularjs Architekturdiagramm
  • Der Controller repräsentiert die Schicht mit der Geschäftslogik. Benutzerereignisse lösen die Funktionen aus, die in Ihrem Controller gespeichert sind. Die Benutzerereignisse sind Teil des Controllers.

  • Ansichten werden verwendet, um die Präsentationsschicht darzustellen, die den Endbenutzern zur Verfügung gestellt wird

  • Modelle werden verwendet, um Ihre Daten darzustellen. Die Daten in Ihrem Modell können so einfach sein wie nur primitive Deklarationen. Wenn Sie beispielsweise eine Studentenanwendung verwalten, kann Ihr Datenmodell nur eine Studenten-ID und einen Namen haben. Oder es kann auch komplex sein, wenn ein strukturiertes Datenmodell vorhanden ist. Wenn Sie eine Fahrzeugbesitzanwendung verwalten, können Sie Strukturen haben, um das Fahrzeug selbst in Bezug auf Motorleistung, Sitzkapazität usw. zu definieren.

AngularJS Vorteile

  • Da es sich um ein Open Source-Framework handelt, können Sie davon ausgehen, dass die Anzahl der Fehler oder Probleme minimal ist.

  • Zweiwege-Bindung - Angular.js hält die Daten- und Präsentationsschicht synchron. Jetzt müssen Sie keinen zusätzlichen JavaScript-Code schreiben, um die Daten in Ihrem HTML-Code und Ihre Daten später synchron zu halten. Angular.js erledigt dies automatisch für Sie. Sie müssen nur angeben, welches Steuerelement an welchen Teil Ihres Modells gebunden ist.

  • Routing - Angular kann sich um das Routing kümmern, dh von einer Ansicht zur anderen wechseln. Dies ist die grundlegende Grundlage für Anwendungen mit nur einer Seite. Dabei können Sie basierend auf der Benutzerinteraktion zu verschiedenen Funktionen in Ihrer Webanwendung wechseln und trotzdem auf derselben Seite bleiben.

  • Angular unterstützt Tests, sowohl Unit-Tests als auch Integrationstests.

  • Es erweitert HTML durch die Bereitstellung eigener Elemente, die als Direktiven bezeichnet werden. Auf hoher Ebene sind Direktiven Markierungen in einem DOM-Element (z. B. ein Attribut, ein Elementname und ein Kommentar oder eine CSS-Klasse), die den HTML-Compiler von AngularJS anweisen, diesem DOM-Element ein bestimmtes Verhalten zuzuordnen. Diese Anweisungen helfen bei der Erweiterung der Funktionalität vorhandener HTML-Elemente, um Ihrer Webanwendung mehr Leistung zu verleihen.