To illustrate how ANGULARJS enhances standard HTML, we will first create a static HTML page template and then convert the static HTML page template to a dynamically displayed Angularjs template.
In this step, we add the basic information of two phones to the HTML page and use the following command to reset the working directory to step 1.
git checkout -f step-1
Please edit the app/index.html file, add the following code to the Index.html file, and then run the app to see the effect.
App/index.html
<ul> <li> <span>nexus s</span> <p> Fast just got faster with Nexus S. </p>< Span class= "PLN" > </li> <li> span class= "tag" ><span>motorola xoom™with wi-fi</span> <p> The next, next Generation tablet. </p> </li></UL>
Practice
Try adding more static HTML code to index.html, for example:
<p>Total number of phones: 2</p>
Summarize
This step adds a list of static HTML phones to your app, now let's go to step 2 to learn how to use ANGULARJS to dynamically generate the same list.