[成都|荣耀师兄]JS-郑明月|2017年03月19日的日报-技能树.IT修真院

发表于： 2017-03-19 22:56:46

2 1235

一、今天完成的事情：

1.看了下跨域的问题；

2.看了下provider、service、factory的区别；

二、明天要做的事情：

1.后端接口应该能出来几个了，全部测试完成！

2.写简历啦！

3.继续看基础！

三、问题：

定义服务的方法们：

1.constant，这个可以用来定义常量，注意它是不能被修改的哦！差不多就是这样做了：

angular.module("admin")
//公司编辑常量组
    .constant('companyConstent', {
        //公司人数
        companyPop: [
            {type: 0, name: '1-10人'},
            {type: 1, name: '10-20人'},
            {type: 2, name: '30-50人'},
            {type: 3, name: '50-100人'},
            {type: 4, name: '100-200人'},
            {type: 5, name: '200-500人'},
            {type: 6, name: '500-1000人'},
            {type: 7, name: '1000人以上'}
        ],

2.value，它跟常量过的定义方法一样，不过它是可以被修改的！

3.service，它是一个构造函数，每次调用它的时候，就相当于使用了一次new操作符，它是一个单例对象，可以用来在controller中进行通信和共享数据哟！，在service里面可以不用返回东西，angular会自动使用new操作符来创建对象，返回一下对象当然也不会出错啦！你大可以使用闭包的方法，来实现私有函数；必须我这里写一个能够储存东西的service：

.service('productService',function () {
        var productList = [];
        var addProduct = function (obj) {
            productList = [];
            productList.push(obj)
        };
        var getProduct = function () {
            return productList
        };
        return {
            addProduct:addProduct,
            getProduct:getProduct
        };
});

4.factory，它是一个可以注入的function，它和service最大的区别是，service是一个构造函数，可以不返回任何东西，但是factory必须要返回东西，而且它可以返回任何东西，写的时候很简单，

.factory('ArticleManagementService', function ($http, pathProject) {
    return {
        //获取
        getArticleList: function (params) {
            return $http.get(pathProject.getArticlelist_url, {params: params});
        },

大概就是这样子啦，注意，它直接把整个对象全部返回回去就行了，注意，它实际上是一个只有$get方法的provider

5.provider就是它们的老大，也可以说provider就是一个可以配置的factory，而且它必须有一个$get方法，而且他可以配置，先上代码吧

var app = angular.module('app', []);
 
app.provider('movie', function () {
  var version;
  return {
    setVersion: function (value) {
      version = value;
    },
    $get: function () {
      return {
          title: 'The Matrix' + ' ' + version
      }
    }
  }
});
 
app.config(function (movieProvider) {
  movieProvider.setVersion('Reloaded');
});
 
app.controller('ctrl', function (movie) {
  expect(movie.title).toEqual('The Matrix Reloaded');});

在上面我们可以看到，当我们在配置的时候需要这样写 providerName+Provider 这样的格式来配置！，具体的配置参数参考网上咯；

6.devorator，这个东西我以前也没有讲过，它是一个装饰器，可以用来装饰或者封装出了constant以外的所有服务，它可以这样写：

var app = angular.module('app', []);
 
app.value('movieTitle', 'The Matrix');
 
app.config(function ($provide) {
  $provide.decorator('movieTitle', function ($delegate) {
    return $delegate + ' - starring Keanu Reeves';
  });
});
 
app.controller('myController', function (movieTitle) {
  expect(movieTitle).toEqual('The Matrix - starring Keanu Reeves');
});