AngularJS(五)階乘實例1

轉載出處:http://www.cnblogs.com/liulangmao/p/3714209.html


複製代碼
<!DOCTYPE html>
<html ng-app>
<head>
  <title>2.3.2計算階乘實例1</title>
  <meta charset="utf-8">
  <script src="../angular.js"></script>
  <script src="script.js"></script>
</head>
<body>
  <div ng-controller = 'Factorial'>
    <form action="">
      <input type="text" ng-model="factorial.number" ng-change="compute()"/>
      的階乘結果是:
      <span>{{factorial.result}}</span>
    </form>
  </div>
</body>
</html>
複製代碼
複製代碼
function Factorial ($scope) {
    $scope.factorial = {};
    $scope.factorial.number = 0;
    $scope.factorial.result = 1;
    $scope.factorialNum = function(num){
        if(num==0){
            return 1;
        }
        else {
            return num*$scope.factorialNum(--num);
        }
    };
    $scope.compute = function(){
        $scope.factorial.result = $scope.factorialNum($scope.factorial.number);
    }
}
複製代碼

1.ng-model:

將input元素與factorial.number進行綁定

 

2.ng-change:

給input元素的change事件綁定回調函數爲compute方法

 

3.{{factorial.result}}

compute方法會通過factorial.number的值計算factorial.result的值,然後factorial.result的值是和ui進行綁定的.所以,input的value值改變時,span中相應的值也會改變


發佈了0 篇原創文章 · 獲贊 1 · 訪問量 1萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章