angualr功能函数汇总

作者: 遥望泰山 | 来源:发表于2016-07-21 10:45 被阅读0次

angualr功能函数汇总
Subtotal：求数据列表或数据库中的分类汇总
Sass函数功能汇总
SUBTOTAL使用方法
•Sumif，sumifs函数，E战笔记
Angular cdk 学习之 drag-drop
《mysql必知必会》读书实战笔记12-汇总数据
cookies封装
Ionic4 生命周期钩子函数和angular生命周期钩子
Ionic4 生命周期钩子函数-Lifecycles

angular.fromJson
angular.toJson
angular.identify
ngBindTemplate

angular.fromJson
把JsonString转化为对象或者对象数组

<!DOCTYPE html>
<html lang="en" ng-app="copyExample">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="angular/angular.min.js"></script>
</head>
<body>
<div ng-controller="ExampleController">
    <button ng-click="parse()">点击我！</button>
</div>
<script>

    angular.module('copyExample', [])
            .controller('ExampleController', ['$scope', function($scope) {
                $scope.parse = function()
                {
                    var json = '{"name":"liSi", "password":"321"}';
                    var jsonArr = '[{"name":"zhangSan", "password":"123"},' +
                            '{"name":"liSi", "password":"321"}' +
                            ']';

                    var obj = angular.fromJson(jsonArr);
                    console.log(obj);

                    var objArr = angular.fromJson(jsonArr);
                    console.log(objArr[0].name);
                    console.log(objArr[1].password);
                }
            }]);
</script>
</body>
</html>

angular.toJson

从对象到json

<!DOCTYPE html>
<html lang="en" ng-app="copyExample">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="angular/angular.min.js"></script>
</head>
<body>
<div ng-controller="ExampleController">
    <button ng-click="parse1()">点击我！</button>
</div>
<script>

    angular.module('copyExample', [])
            .controller('ExampleController', ['$scope', function($scope) {
                $scope.parse1 = function()
                {
                    var obj =
                    {
                        name:"liSi", password:"321"
                    };
                    var str = angular.toJson(obj, true);
                    console.log(str);
                }

            }]);
</script>
</body>
</html>

angular.identify
函数返回本身的第一个参数, 这个函数一般用于函数风格

<!DOCTYPE html>
<html lang="en" ng-app="copyExample">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="angular/angular.min.js"></script>
</head>
<body ng-controller="ExampleController">
<div>
    <div>
        angular.identity
    </div>
    <div  >
        <input type="button" id="btn" ng-click="show()" value="answer" />
        :<input type="text" id="answer" ng-model="result" />
    </div>
</div>
<script>

    angular.module('copyExample', [])
            .controller('ExampleController', ['$scope', function($scope) {
                $scope.result = "";
                $scope.double = function(n){
                    return n*2;
                }
                $scope.triple = function(n){
                    return n*3;
                }
                $scope.answer = function(fn, val){
                    return (fn || angular.identity)(val);
                }
                $scope.show = function(){
                    $scope.result = $scope.answer($scope.double, 3);
                    console.log($scope.result);
                }

            }]);
</script>
</body>
</html>

angular.noop

 function testCtrl() {
      var _console = function (v) {
          return v * 2;
      };
      var getResult = function (fn, val) {
          return (fn || angular.noop)(val);
      };
      var firstResult = getResult(_console, 3);//6
      var secondResult = getResult(null, 3);//undefined
      var thirdResult = getResult(undefined, 3);// undefined
    };

ngBindTemplate
绑定多个模版

<script>
  angular.module('bindExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.salutation = 'Hello';
      $scope.name = 'World';
    }]);
</script>
<div ng-controller="ExampleController">
 <label>Salutation: <input type="text" ng-model="salutation"></label><br>
 <label>Name: <input type="text" ng-model="name"></label><br>
 <pre ng-bind-template="{{salutation}} {{name}}!"></pre>
</div>