Um zu veranschaulichen, wie AngularJs die Standard -HTML -Vorlage verbessert, erstellen wir zunächst eine statische HTML -Seitenvorlage und konvertieren diese statische HTML -Seitenvorlage in eine AngularJS -Vorlage, die dynamisch angezeigt werden kann.
In diesem Schritt fügen wir der HTML -Seite die grundlegenden Informationen von zwei Telefonen hinzu und setzen das Arbeitsverzeichnis mit dem folgenden Befehl auf Schritt 1 zurück.
Die Codekopie lautet wie folgt:
Git Checkout -f Schritt -1
Bitte bearbeiten Sie die Datei App/Index.html, fügen Sie den folgenden Code zur Datei idex.html hinzu und führen Sie die App aus, um den Effekt anzuzeigen.
app/index.html
Die Codekopie lautet wie folgt:
<ul>
<li>
<span> Nexus S </span>
<p>
Schnell wurde mit Nexus S. schneller
</p>
</li>
<li>
<spann> motorola xoom ™ mit Wi-Fi </span>
<p>
Das nächste Tafel der nächsten Generation.
</p>
</li>
</ul>
üben
Versuchen Sie, in INDEX.HTML mehrere statische HTML -Code hinzuzufügen, zum Beispiel:
Die Codekopie lautet wie folgt:
<p> Gesamtzahl der Telefone: 2 </p>
Zusammenfassen
Dieser Schritt fügt der App eine statische HTML -Telefonliste hinzu. Gehen Sie nun zu Schritt 2, um zu verstehen, wie Sie die gleiche Liste mit AngularJS dynamisch generieren.