首頁 > web前端 > js教程 > AngularJS入門教學(一):靜態模板_AngularJS

AngularJS入門教學(一):靜態模板_AngularJS

WBOY
發布: 2016-05-16 16:28:31
原創
1581 人瀏覽過

為了說明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動態產生相同的列表。

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板