Heim > Web-Frontend > js-Tutorial > Wie verwende ich AngularJS-Ausdrücke? Details zur Verwendung von Ausdrücken in AngularJS

Wie verwende ich AngularJS-Ausdrücke? Details zur Verwendung von Ausdrücken in AngularJS

寻∝梦
Freigeben: 2018-09-08 14:26:39
Original
1403 Leute haben es durchsucht

Dieser Artikel führt Sie hauptsächlich in die Verwendung von Ausdrücken in AngularJS, Anwendungsbeispiele für AngularJS-Zahlen und die Details der Verwendung von AngularJS-Strings, -Objekten und -Arrays ein zusammen Dieser Artikel

AngularJS verwendet Ausdrücke, um Daten an HTML zu binden.

AngularJS-Ausdruck

AngularJS-Ausdruck wird in doppelten geschweiften Klammern geschrieben: {{ Ausdruck }}.

Der AngularJS-Ausdruck bindet Daten an HTML, was der ng-bind-Direktive ähnelt.

AngularJS „gibt“ die Daten dort aus, wo der Ausdruck geschrieben ist.

AngularJS-Ausdrücke ähneln JavaScript-Ausdrücken: Sie können Literale, Operatoren und Variablen enthalten.

Instanz {{ 5 + 5 }} oder {{ firstName + " " + lastName }}

AngularJS-Nummern

AngularJS-Nummern sind wie JavaScript-Nummern:

<p ng-app="" ng-init="quantity=1;cost=5">
 <p>总价: {{ quantity * cost }}</p>
 </p>
Nach dem Login kopieren

Dasselbe Beispiel mit ng-bind:

<p ng-app="" ng-init="quantity=1;cost=5">
 <p>总价: <span ng-bind="quantity * cost"></span></p>
 </p>
Nach dem Login kopieren

Die Verwendung von ng-init ist nicht sehr verbreitet. Im Kapitel „Controller“ erfahren Sie, wie Sie Daten besser initialisieren können.

AngularJS-Strings

AngularJS-Strings sind genau wie JavaScript-Strings:

<p ng-app="" ng-init="firstName=&#39;John&#39;;lastName=&#39;Doe&#39;">
<p>姓名: {{ firstName + " " + lastName }}</p>
</p>
Nach dem Login kopieren

Gleiche Instanz mit ng-bind:

<p ng-app="" ng-init="firstName=&#39;John&#39;;lastName=&#39;Doe&#39;">
 <p>姓名: <span ng-bind="firstName + &#39; &#39; + lastName"></span></p>
</p>
Nach dem Login kopieren

AngularJS-Objekte

AngularJS-Objekte sind wie JavaScript-Objekte:

<p ng-app="" ng-init="person={firstName:&#39;John&#39;,lastName:&#39;Doe&#39;}">
 <p>姓为 {{ person.lastName }}</p>
 </p>
Nach dem Login kopieren

*lastName, Groß-/Kleinschreibung beachten (wenn Sie mehr wissen möchten, besuchen Sie die chinesische PHP-Website AngularJS Development Manual, um mehr zu erfahren)

Die gleiche Instanz mit ng-bind:

<p ng-app="" ng-init="person={firstName:&#39;John&#39;,lastName:&#39;Doe&#39;}">
 <p>姓为 <span ng-bind="person.lastName"></span></p>
 </p>
Nach dem Login kopieren

AngularJS-Arrays

AngularJS-Arrays sind genau wie JavaScript-Arrays:

<p ng-app="" ng-init="points=[1,15,19,2,40]">
 <p>第三个值为 {{ points[2] }}</p>
 </p>
Nach dem Login kopieren

Die gleiche Instanz mit ng-bind:

<p ng-app="" ng-init="points=[1,15,19,2,40]">
 <p>第三个值为 <span ng-bind="points[2]"></span></p>
 </p>
Nach dem Login kopieren

AngularJS-Ausdrücke und JavaScript-Ausdrücke

Ähnlich wie JavaScript-Ausdrücke können AngularJS-Ausdrücke Buchstaben, Operatoren und Variablen enthalten.

Im Gegensatz zu JavaScript-Ausdrücken können

AngularJS-Ausdrücke in HTML geschrieben werden.

AngularJS-Ausdrücke unterstützen keine bedingten Beurteilungen, Schleifen und Ausnahmen.

AngularJS-Ausdrücke unterstützen Filter.
Okay, dieser Artikel endet hier (wenn Sie mehr lesen möchten, besuchen Sie die chinesische PHP-Website AngularJS-Benutzerhandbuch , um mehr zu erfahren. Wenn Sie Fragen haben, können Sie unten eine Nachricht hinterlassen).

Das obige ist der detaillierte Inhalt vonWie verwende ich AngularJS-Ausdrücke? Details zur Verwendung von Ausdrücken in AngularJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage