angularjs基本簡介

標籤：javascrip   函數   span   ng-model   nbsp   檔案   所有者   bind   name   

之前講述過一些關於easyUI的基本用法，現在給大家簡述一下angularjs與easyUI的區別。

首先區分一下angularjs與easyUI

1.angularjs是html和js之間的資料銜接層，可以操控html元素（資料繫結、重複、隱藏）等，上手很容易，但想要精通，瞭解內部運行機制不容易。

2.jquery指令碼是一個 JavaScript 函數庫，與angularjs作用一直，但更偏重於操作dom元素，對dom遍曆和修改。

3.easyUI是基於jQuery的架構，它側重於頁面顯示部分，即UI，但是所有效果都是用jQuery實現的。

然後，我們一起進入今天的正題：

一、angularjs簡介：

　　1.AngularJS 是一個 JavaScript 架構。它可通過 <script> 標籤添加到 HTML 頁面。

       2.AngularJS 通過 指令 擴充了 HTML，且通過 運算式 綁定資料到 HTML。

      3.AngularJS通過JavaScript檔案寫入到項目中，所以需要引用<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

　  4.AngularJS版本下載可借鑒： https://github.com/angular/angular.js/releases

二、angularjs擴充了HTML

     1.AngularJS 通過 ng-directives 擴充了 HTML。

     2.ng-app 指令定義一個 AngularJS 應用程式。

     3.ng-model 指令把元素值（比如輸入欄位的值）綁定到應用程式。

     4.ng-bind 指令把應用程式資料綁定到 HTML 視圖。

  　　 eg:

　　原始碼

例子講解：

1.ng-app 指令告訴 AngularJS，<div> 元素是 AngularJS 應用程式 的"所有者"。

2.ng-model 指令把輸入欄位的值綁定到應用程式變數 name。

3.ng-bind 指令把應用程式變數 name 綁定到某個段落的 innerHTML。

今天就到這啦，大家有沒有覺得AngularJS比html更加方便了不少了，如果大家有興趣的話，歡迎大家在之後的日子裡和我一起學習。如果有什麼問題，歡迎大家聯絡我。

angularjs基本簡介