AngularJS入門教學（一）：靜態模板_AngularJS

為了說明angularJS如何增強了標準HTML，我們先將建立一個靜態HTML頁面模板，然後把這個靜態HTML頁面模板轉換成能動態顯示的AngularJS模板。

在本步驟中，我們往HTML頁面中新增兩個手機的基本訊息，用以下指令將工作目錄重設為步驟1。

複製程式碼 程式碼如下:

git checkout -f step-1

請編輯app/index.html文件，將下面的程式碼加入index.html檔案中，然後執行該應用程式查看效果。

app/index.html

複製程式碼 程式碼如下:

   
• 
          Nexus S
         

  
          Fast just got faster with Nexus S.
         

  
     

   
• 
          Motorola XOOM™ with Wi-Fi
         

  
          The Next, Next Generation tablet.
         

  
     

練習

嘗試新增多個靜態HTML程式碼到index.html， 例如：

複製程式碼 程式碼如下:

Total number of phones: 2

總結

本步驟往應用程式中新增了靜態HTML手機列表， 現在讓我們轉到步驟2以了解如何使用AngularJS動態產生相同的列表。