1. 程式人生 > >【AngularJS】如果你修改了檢視,模型和控制器也會相應更新

【AngularJS】如果你修改了檢視,模型和控制器也會相應更新

如果你修改了檢視,模型和控制器也會相應更新

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>	
<body>
	<div ng-app="myApp" ng-controller="myCtrl">
		<input ng-model="name"/>
		<h1>{{
greeting}}</h1> <button ng-click='sayHello()'>點我</button> </div> <script> var app=angular.module('myApp',[]); app.controller('myCtrl',function($scope){ $scope.name="陶洲川"; $scope.sayHello=function(){ $scope.greeting='你好 '+$scope.name+'!'; }; }); </script> <p>當你修改輸入框中的值得時候,會影響到模型(model),當然也會影響到控制性對應的屬性</p> </body> </html>
還是老規矩,談一點自己的感想;

①ng-click是點選方法,後面跟方法名;ng-click=‘sayHello’點選呼叫sayHello()方法;

②var app=angular.module('myApp',[]); 定義變數app,元件屬於myApp這個應用程式;

③$scope中的name是靜態變數:“陶洲川”;

   $scope中的sayHello是方法,等於$scope.greeting+$scope.name+‘!’;

④所有的方法(function)都得寫在controller裡面()

⑤定義格式問題:

定義app應用程式:var app=angular.module('myApp',[]);

定義app的控制器:app.controller('myCtrl',function($scope){

}

截圖: