AngularJS 服务(Service)

最新推荐文章于 2020-08-29 17:08:46 发布

雾里看花叹朦胧

最新推荐文章于 2020-08-29 17:08:46 发布

阅读量223

点赞数

分类专栏： angularjs 文章标签： angularjs

本文链接：https://blog.csdn.net/hsl0530hsl/article/details/77917343

版权

angularjs 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS 服务(Service)</title>

    <script src="../js/jquery-2.1.3.min.js"></script>
    <script src="../js/angular.min.js"></script>
</head>
<body>

    <!--
        $location: window.location, 方法有 $location.absUrl()
        $http: jquery.ajax 方法有 $http.get
        $timeout: window.setTimeout 也是有区别的
        $interval: window.setInterval 也是有区别的
    -->

    <!--<div ng-app="myApp" ng-controller="myCtrl">
        创建自定义服务:
        {{hex}}
    </div>
    <script>
        var app = angular.module('myApp', []);

        app.service('hexafy', function() {
            this.myFunc = function (x) {
                return x.toString(16);
            }
        });
        app.controller('myCtrl', function($scope, hexafy) {
            $scope.hex = hexafy.myFunc(255);
        });
    </script>-->

    <!--过滤器中，使用自定义服务-->
    <div ng-app="myApp" ng-controller="myCtrl">
        <p>在获取数组 [255, 251, 200] 值时使用过滤器:</p>

        <ul>
            <li ng-repeat="x in counts">{{x | myFormat}}</li>
        </ul>

        <p>过滤器使用服务将10进制转换为16进制。</p>
    </div>

    <script>
        var app = angular.module('myApp', []);
        app.service('hexafy', function() {
            this.myFunc = function (x) {
                return x.toString(16);
            }
        });
        app.filter('myFormat',['hexafy', function(hexafy) {
            return function(x) {
                return hexafy.myFunc(x);
            };
        }]);
        app.controller('myCtrl', function($scope) {
            $scope.counts = [255, 251, 200];
        });
    </script>

</body>
</html>