【AngularJS】如果你修改了檢視,模型和控制器也會相應更新
阿新 • • 發佈:2019-01-24
如果你修改了檢視,模型和控制器也會相應更新
<!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){
}
截圖: