標籤：function 控制器 標籤 元素
引用angularjs指令碼庫，在DOM元素上聲明ng-app屬性、ng-controller控制器，標籤上使用ng-model指令。聲明“myApp”模組（module）以及“myController”控制器（controller）
例子如下代碼：
<!doctype html><html ng-app="myApp"><head><meta charset="utf-8"><title>angularjs</title><script src="js/angular.min.js"></script><script type="text/javascript">var myApp=angular.module(‘myApp‘,[]);myApp.controller(‘myController‘,function($scope,$timeout){ //1.資料繫結 $scope.name="Boy"; //2.更新時鐘時間（調用對象本身） var updateClock=function(){ $scope.clock=new Date(); $timeout(function(){ updateClock(); },1000) } updateClock(); //更新時鐘時間（調用對象屬性） $scope.clock1={ now:new Date() } var updateClockp=function(){ $scope.clock1.now=new Date(); } setInterval(function(){ $scope.$apply(updateClockp()); },1000) updateClockp();});</script><style type="text/css">b { font-family: "微軟雅黑 Light"; font-size: 24px; font-weight: bold; color: #F00;}</style></head><body><div ng-controller=‘myController‘> 1.//簡單的資料繫結 <br/> <input type="text" ng-model="name" placeholder="Your Name"> <b>Hello {{name}}</b> <br/> <br/> 2.//更新時鐘時間（調用對象本身） <br/> <b>{{clock|date:‘yyyy-MM-dd HH:mm:ss‘}}</b> <br/> <br/> 3.//更新時鐘時間（調用對象屬性）<br/> <b>{{clock1.now|date:‘yyyy-MM-dd HH:mm:ss‘}}</b> <br/> </div></body></html>
本文出自 “記錄成長點滴” 部落格，請務必保留此出處http://huatumi.blog.51cto.com/8272213/1879956
AngularJS簡單的資料繫結
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
