Angular技术库
  • 简介
  • 研究热点
    • 单页面登录
    • 单页面服务器渲染
  • 项目实战
    • 目录结构
    • 模块开发流程
    • 公共模块编辑
    • UI使用
    • 工具库
      • util模块
      • filter模块
    • 表单验证
  • 整体框架
    • 环境搭建
      • Windows
      • MAC Linux
    • 示例项目
    • 开发调试
      • 编译JS
      • 编译CSS
      • 编译HTML
      • 编译Bower
      • 服务器启动
      • 与后端服务通讯
    • Gulp文档
      • Gulp API
      • 插件列表
      • Gulp构建
    • Gulp文档
    • 示例项目
  • Angular文档
    • 指令
    • 引导
    • 单页面
    • 基于requireJS和angularJS的前端技术架构
    • 数据共享
    • 模块加载
    • 事件循环
  • SASS文档
    • SASS特性
  • ES6文档
    • ECMAScript前导
    • ECMAScript6特性介绍
    • ES6特性筛选
  • JavaScript文档
    • 匿名函数定义
    • Function
      • 原生prototype
      • 自定义prototype
  • RequireJS
  • Node文档
  • 架构师
  • 时间轴
    • 2016-07-13
    • 2016-06-21
    • 2016-06-14
    • 2016-06-07
    • 2016-05-31
Powered by GitBook
On this page
  • 1.Service
  • 1.1注册Service
  • 2.工具类
  1. 项目实战

公共模块编辑

1.Service

Service是Angular的公共服务,是Angular中很常用的一个数据处理模式,一般有如下两个用途: 1. 公共方法的封装,如Http服务 2. 单例模式数据保存,如登录用户信息

公共Service放在modules/common/js/service目录。

1.1注册Service

  1. 定义Service类(使用ES6模式),并注入依赖服务

    /**
    * 示例:登录用户信息管理
    */
    class Host{
     constructor($$http){
         this.$$http = $$http;
     }
     getHost = (callback, refresh)=>{
         this.$$http.get("/mine/info.do", null, (data, success) => {
             console.log(data);
         });
     }
    }
    /**
    * 注入依赖服务
    */
    Host.$inject=["$$http"];
  2. 注册Service

    App.register.service("$$host", Host);

    1.2Service命名规范

    自定义Service采用$$开头的前缀,以区别Angular内置服务$$host, $$http。

2.工具类

公共工具类是项目的工具库,放置一些静态的方法和JS对象的polyfill。如:

/**
 * 为字符串添加trim()方法
 */
String.prototype.trim = function(){
    return $.trim(this);
}

文件位置位于 modules/common/js/util.js

Previous模块开发流程NextUI使用

Last updated 7 years ago