AngularJS工厂/服务实现一个计算器

html代码

 <div ng-controller="calcCtrl"> <select ng-model="type"> <option value="active">动态响应模式</option> <option value="static">手动点击模式</option> </select> <input type="text" ng-model="num1"> <select ng-model="operator"> <option value="1">+</option> <option value="2">-</option> <option value="3">*</option> <option value="4">/</option> </select> <input type="text" ng-model="num2"> <button id="bResult" type="button" ng-click="calculate()">=</button> <span>{{result}}</span> </div>

<select>标签<option>里面传的参数是value里的值

js代码

'use strict';

var app = angular.module('app', []);

app.controller('calcCtrl', function($scope, myService) {
        $scope.type = 'active';
        $scope.operator = '1';
        $scope.num1 = 0;
        $scope.num2 = 0;
        $scope.result = 0;

        $scope.calculate = function() {
        $scope.result =myService.getResult(Number($scope.num1), Number($scope.num2), $scope.operator);
        };

        var activeModeListen;

        $scope.$watch('type', function(newType) {
                if(newType == 'active') { //自动计算
                    $('#bResult').attr('disabled', 'true');
                    activeModeListen = $scope.$watchGroup(['num1', 'num2', 'operator'], function() {
                            $scope.result = myService.getResult(Number($scope.num1), Number($scope.num2), $scope.operator);
                        }
                    );
                }
                else if(newType == 'static') { //需要按等号
                    activeModeListen();
                    $('#bResult').removeAttr('disabled');
                }
            }
        );
    })
    .factory('myFactory', function() {
            var func = {};
            func.add = function(a, b) {
                if(a.toString().indexOf('.') != -1
                    && b.toString().indexOf('.') != -1) {
                        var sq1,sq2,m;
                        try {
                            sq1 = a.toString().split(".")[1].length;
                        }
                        catch (e) {
                            sq1 = 0;
                        }
                        try {
                            sq2 = b.toString().split(".")[1].length;
                        }
                        catch (e) {
                            sq2 = 0;
                        }
                        m = Math.pow(10,Math.max(sq1, sq2));
                        return (a * m + b * m) / m;
                    }
                    else {
                        return a + b;
                    }
            };

            func.minus = function(a, b) {
                return a - b;
            };

            func.multiply = function(a, b) {
                return a * b;
            };

            func.divided = function(a, b) {
                return a / b;
            };

            return func;//将声明的func对象返回
        }
    )
    .service('myService', function(myFactory) {
            this.getResult = function(m, n, operator) {
                var regExp = /[0-9]+/;
                if(!regExp.test(m) || !regExp.test(n)) {
                    alert('must input number instead of others type of variable')
                }
                else {
                    if(operator == '1') {
                        return myFactory.add(m, n);
                    }

                    else if(operator == '2') {
                        return myFactory.minus(m, n);
                    }

                    else if(operator == '3') {
                        return myFactory.multiply(m, n);
                    }

                    else if(operator == '4') {
                        return myFactory.divided(m, n);
                    }
                }
            };
        }
    );

js小数运算出现多位小数的解决方案

function addNum (num1, num2) {
 var sq1,sq2,m;
 try {
  sq1 = num1.toString().split(".")[1].length;
 }
 catch (e) {
  sq1 = 0;
 }
 try {
  sq2 = num2.toString().split(".")[1].length;
 }
 catch (e) {
  sq2 = 0;
 }
 m = Math.pow(10,Math.max(sq1, sq2));
 return (num1 * m + num2 * m) / m;
}
alert(addNum(0.1, 0.2));

工厂提供公用的方法
服务里面写逻辑关系实现某一个模块的功能，比如：一个登录注册界面，可以写两个服务