AngularJS内的服务

通过之前讲解的一些AngularJS里面的一些功能j

今天就来说下我用AngulaerJS里面的服务的一些感触和运用。

AngularJS 服务：

AngularJS中你可以自己创建自己的服务，也可以使用AngularJS里面的内置服务。

什么是服务？

在AngularJS中，服务是一个函数或对象，可在你的AngularJS 应用中使用。

有个 $location 服务，它可以返回当前页面的 URL 地址。

例子：

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $location) {
    $scope.myUrl = $location.absUrl();
});

注意 $location 服务是作为一个参数传递到 controller 中。如果要使用它，需要在 controller 中定义。

为什么使用服务？

在很多服务中，比如 $location 服务，它可以使用 DOM 中存在的对象，类似 window.location 对象，但 window.location 对象在 AngularJS 应用中有一定的局限性。

View视图~专门用于数据的展示和提取
            Controller控制器，主要用于数据的挂载【数据从哪里来？】
            |-- 自定义服务：用于从后端接口获取数据，然后将数据挂载到控制器中
            Model数据模型：应用中要使用的各种数据，一般从后端获取之后存储在控制器的变量中

AngularJS 会一直监控应用，处理事件变化， AngularJS 使用 $location 服务比使用 window.location 对象更好。

$http服务

$http服务是AngularJS应用中最常用的服务。服务向服务器发送请求，应用响应服务器传送过来的数据。

实例：

使用$http服务向服务器请求数据：

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
    $http.get("welcome.htm").then(function (response) {
        $scope.myWelcome = response.data;
    });
});

$timeout服务

AngularJS $timeout服务对应了 JS window.setTimeout函数

实例：

两秒后显示信息：

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $timeout) {
    $scope.name = "Hello World!";初始化的name的值
    $timeout(function () {
        $scope.name = "How are you today?";这是经过两秒以后会出现的内容
    }, 2000);
});

$interval服务

AngularJS $interval 服务对应了JS window.setInterval函数

实例：

每一秒显示信息：

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $interval) {
    $scope.theTime = new Date();这个可以不要但是显示之前会会有1秒的延迟才会出现
    $interval(function () {
        $scope.theTime = new Date();
    }, 1000);
});

自定义服务

创建自定义服务的三种方式：

1.factory工厂模式实现：比较常用，根据项目组规范进行确定是否使用

 第一种实现方式：factory模式

 第一种实现方式，以其简洁的使用特色而流行于自定义服务行列
 在处理返回数据的时候，可以返回字面量、数组、对象、复杂对象等等各种数据
 极大的满足了我们项目的需要，所以使用较多，需要掌握！

实例：

 var a=angular.module("App",[]);
    a.controller("my",["$scope","diyi",function ($scope,a1) {
           $scope.va=a1
    }])
    a.factory("diyi",function () {
        var a="factory 模拟的数据"  从后端获取数据:模拟
        return a;                   返回数据，返回的数据可以是字符串，可以是复杂对象
    })

2.service对象方式：比较常用，根据项目组规范进行确定是否使用

第二种实现方式，以其规范的返回数据而流行与自定义服务行列
service方式，只能返回对象，在某些项目组中，为了规范服务返回的数据~也就是强制指定
必须返回对象数据，才能正常解析，避免了出现大量的各种格式的数据：由于返回数据的标准化而流行！

var a=angular.module("App",[]);
    a.controller("my",["$scope","dier",function ($scope,a2) {
           $scope.va=a2
    }])
    a.service("dier",function () {
        var a="factory 模拟的数据"
        return a;
    })

3.provider代理方式：Angular框架中的使用方式，常规项目开发很少使用

第三种实现方式，要求处理的过程中必须通过this.$get()函数进行返回数据的处理
这种方式在Angular自己的内置服务和框架中使用较多，但是不推荐在项目开发中使用
因为操作的复杂性和代码的可读性无形中让开发人员掌握有一定的难度

var a=angular.module("App",[]);
    a.controller("my",["$scope","disan",function ($scope,a3){
           $scope.va=a3
    }])
    a.provider("disan",function () {
        var a="factory 模拟的数据"
        return a;
    })
以上都是我对于AngularJS 服务的理解，想要了解过更多请看我的下一篇