數據綁定這塊兒沒啥說的,簡單兩個例子帶過了。 Hello World: <!DOCTYPE html> <html ng-app> <head> <title>Simple app</title> <script src="https://ajax.googleapis.com/ajax/libs/ ...
數據綁定這塊兒沒啥說的,簡單兩個例子帶過了。
Hello World:
<!DOCTYPE html> <html ng-app> <head>
<title>Simple app</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
</head>
<body> <input ng-model="name" type="text" placeholder="Your name"> <h1>Hello {{ name }}</h1>
</body> </html>
這就是有趣的雙向數據綁定,AngularJS 會記錄數據模型所包含的數據在任何特定時間點的值,而不是原始值。當他認為某個值可能發生變化時,
就會運行自己的事件迴圈來檢查這個值是否變臟,如果該值從上次事件迴圈之後發生了變化,則該值被認為是臟值。這也是 Angular 可以跟蹤和響應應用變化的方式。
數據模型對象:這裡是指$scope。它的屬性可以被視圖訪問,也可以同控制器交互。
數據綁定的最佳實踐:
由於 JS 本身的特點,以及他在引用和傳值時的不同處理方式,通常認為,,在視圖中通過對象的屬性而非對象本身來進行數據綁定,是 Angular的最佳實踐。
一個簡單的計時器:
<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
</head>
<body>
<div ng-controller="MyController">
<h1>Hello {{ clock.now }}!</h1> </div>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
//app.js
function MyController($scope) {
$scope.clock = { now: new Date()
}; var updateClock = function() {
$scope.clock.now = new Date() };
setInterval(function() { $scope.$apply(updateClock);
},1000)
updateClock();
};
關於臟值檢查相關請參考:
http://www.cnblogs.com/Slim-Shady/p/5217221.html