Angular——内置服务

$location

<!DOCTYPE html>
<html lang="en" ng-app="App">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul ng-controller="DemoController">
    <li>{{absUrl}}</li>
    <li>{{url}}</li>
    <li>{{host}}</li>
    <li>{{search}}</li>
    <li>{{hash}}</li>
    <li>{{protocol}}</li>
    <li>{{port}}</li>
</ul>
<script src="../libs/angular.min.js"></script>
<script>
    var App = angular.module('App', []);
    App.controller('DemoController', ['$scope', '$location', function ($scope, $location) {
        $scope.absUrl = $location.absUrl();
        $scope.url = $location.url();
        $scope.host = $location.host();
        $scope.search = $location.search();
        $scope.hash = $location.hash();
        $scope.protocol = $location.protocol();
        $scope.prot = $location.port();
    }]);
    //url 是锚点 # 之后的东西
    //search 是锚点#之后的?之后的参数的键值对,原始的search就是在?之后
    //hash 是锚点,但是在angular中,锚点指的是第一个#之后,第二个#之后的内容
    for (key in location) {
        console.log(key + '===' + location[key])
    }
</script>
</body>
</html>

$timeout、$interval

<!DOCTYPE html>
<html lang="en" ng-app="App">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul ng-controller="DemoController">
    <li>{{time|date:'yy-MM-dd'}}</li>
    <li>{{text}}</li>
    <li>
        <button ng-click="stop()">停止</button>
    </li>
</ul>
<script src="../libs/angular.min.js"></script>
<script>
    var App = angular.module('App', []);
    App.controller('DemoController', ['$scope', '$timeout', '$interval', function ($scope, $timeout, $interval) {
        $timeout(function () {
            $scope.time = new Date();
        }, 1000);
        var num = 0;
        var timer = $interval(function () {
            num++;
            $scope.text = num;
        }, 1000);
        $scope.stop = function () {
            $interval.cancel(timer);
        }
    }]);
</script>
</body>
</html>

$filter

<!DOCTYPE html>
<html lang="en" ng-app="App">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul ng-controller="DemoController">
    <li>{{price}}</li>
    <li>{{text}}</li>
    <li>{{value}}</li>
</ul>
<script src="../libs/angular.min.js"></script>
<script>
    var App = angular.module('App', []);
    App.controller('DemoController', ['$scope', '$filter', function ($scope, $filter) {
        var currency = $filter('currency');
        $scope.price = currency(11.11);
        $scope.text = $filter('uppercase')('hello');
        $scope.value = $filter('limitTo')('hello', 2);
    }]);
</script>
</body>
</html>

$log  

<!DOCTYPE html>
<html lang="en" ng-app="App">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul ng-controller="DemoController">
</ul>
<script src="../libs/angular.min.js"></script>
<script>
    var App = angular.module('App', []);
    App.controller('DemoController', ['$scope', '$log', function ($scope, $log) {

        $log.info('普通信息');

        $log.warn('警告信息');

        $log.error('错误信息');

        $log.log('打印信息');

        $log.debug('调试信息');

    }]);
</script>
</body>
</html>
原文地址:https://www.cnblogs.com/wuqiuxue/p/8423256.html