JavaScript強化教程——AngularJS 指令

ldwying 9年前發布 | 8K 次閱讀 Web框架 angularjs

本文為 H5EDU 機構官方 HTML5培訓 AngularJS 通過被稱為 指令 的新屬性來擴展 HTML。 AngularJS 通過內置的指令來為應用添加功能。 AngularJS 允許你自定義指令。 AngularJS 指令 AngularJS 指令是擴展的 HTML 屬性,帶有前綴 ng-。 ng-app 指令初始化一個 AngularJS 應用程序。 ng-init 指令初始化應用程序數據。 ng-model 指令把元素值(比如輸入域的值)綁定到應用程序。 完整的指令內容可以參閱 AngularJS 參考手冊。 AngularJS 實例

在輸入框中嘗試輸入:

姓名:<input type="text" ng-model="firstName"></p>

你輸入的為: {{ firstName }}

教程,主要介紹:JavaScript強化教程 —— AngularJS 指令 ng-app 指令告訴 AngularJS,

元素是 AngularJS 應用程序 的"所有者"。 Note 一個網頁可以包含多個運行在不同元素中的 AngularJS 應用程序。 數據綁定 上面實例中的 {{ firstName }} 表達式是一個 AngularJS 數據綁定表達式。 AngularJS 中的數據綁定,同步了 AngularJS 表達式與 AngularJS 數據。 {{ firstName }} 是通過 ng-model="firstName" 進行同步。 在下一個實例中,兩個文本域是通過兩個 ng-model 指令同步的: AngularJS 實例

價格計算器

數量: <input type="number" ng-model="quantity"> 價格: <input type="number" ng-model="price">

總價: {{ quantity * price }}

 

來自:http://imweb.io/topic/57c78a3b808fd2fb204eef6b

 

 本文由用戶 ldwying 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!