zoukankan      html  css  js  c++  java
  • angular学习笔记(五)-阶乘计算实例(2)

    <!DOCTYPE html>
    <html ng-app>
    <head>
      <title>2.3.3计算阶乘实例2</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"/>
          的阶乘结果是:
          <span>{{factorial.result}}</span>
        </form>
      </div>
    </body>
    </html>

    同样是这个例子:

    result的改变,本质上是由于number的改变,而不是input的value值改变,number的改变有可能是input的value值改变,也有可能其它input也绑定了number,也有可能后台的数据发生了改变,

    因此,不使用input的ng-change属性来绑定计算result的回调,而是监测number的改变,一旦number发生改变,就实时计算result,并在ui上显示.

    可以使用$watch:

    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);
        };
        $scope.$watch('factorial.number',$scope.compute)
    }

    $watch(参数1,参数2):

    参数1: 被监测的内容,字符串格式,这个字符串中的内容可以是一个表达式,也可以是$scope中的属性,在后面会详细讲解表达式

    参数2: 被监测的内容发生改变后调用的回调

    --------------------------------------------------------------------------------------------------------------------------------------------

    注意,如果是字符串格式,不需要写$scope,比如这里的factorial.number,但如果是变量格式,则必须传入$scope,如$scope.$watch($scope.factorial.number,$scope.compute)

  • 相关阅读:
    第一个独立开发的游戏 怪斯特:零 已经上线APP STORE!
    Cocos2d 利用继承Draw方法制作可显示三维数据(宠物三维等)的三角形显示面板
    java 实现 多态的 三要素
    mysql 基础语法掌握~ This is just the beginning.
    rem ~~ 你懂了吗?
    两个css之间的切换
    JavaScript高级程序设计(第3版)
    保持底部~~永远在底部
    文字要对齐!!!
    改变this不要怕!!!
  • 原文地址:https://www.cnblogs.com/liulangmao/p/3714319.html
Copyright © 2011-2022 走看看