AngularJS-Erste-Schritte-Tutorial (1): Static Template_AngularJS

Um zu veranschaulichen, wie AngularJS Standard-HTML verbessert, erstellen wir zunächst eine statische HTML-Seitenvorlage und konvertieren diese statische HTML-Seitenvorlage dann in eine AngularJS-Vorlage, die dynamisch angezeigt werden kann.

In diesem Schritt fügen wir der HTML-Seite die grundlegenden Informationen der beiden Mobiltelefone hinzu und verwenden den folgenden Befehl, um das Arbeitsverzeichnis auf Schritt 1 zurückzusetzen.

Code kopieren Der Code lautet wie folgt:

git checkout -f Schritt-1

Bitte bearbeiten Sie die Datei app/index.html, fügen Sie den folgenden Code zur Datei index.html hinzu und führen Sie dann die Anwendung aus, um den Effekt zu sehen.

app/index.html

Code kopieren Der Code lautet wie folgt:

• 
                                                                                                                                                                              Schnell ist mit dem Nexus S jetzt noch schneller.
                                                                                   


• 
                                                                                                     Motorola                                                                                   Das nächste Tablet der nächsten Generation.
                                                                                   

Üben

Versuchen Sie, mehrere statische HTML-Codes zu index.html hinzuzufügen, zum Beispiel:

Code kopieren

Der Code lautet wie folgt:

Gesamtzahl der Telefone: 2

Zusammenfassung

Mit diesem Schritt wird der App eine statische HTML-Telefonliste hinzugefügt. Fahren wir nun mit Schritt 2 fort, um zu erfahren, wie Sie dieselbe Liste mit AngularJS dynamisch generieren.