文件命名原则:

  1. 遵循以描述组件功能,然后是类型(可选)的方式来给所有的组件提供统一的命名

    • 命名:feature.type.js。
    • 测试文件名(feature.type.spec.js)
  2. 大多数文件都有2个名字:
    • 文件名 (avengers.controller.js)
    • 带有Angular的注册组件名 (AvengersController)
    • 测试文件名(avengers.controller.spec.js)

规则

  1. 一个文件只定义一个组件

  2. 每一个文件都需要使用JavaScript闭包

  3. 使用module的时候,避免直接用一个变量,而是使用getter的链式语法。

    • 设置module,angular.module('app', []);
    • 获取module,angular.module('app');
  4. 回调函数使用命名函数,不要用匿名函数

     // logger.js
    angular
    .module('app')
    .factory('logger', logger); function logger () { }
  5. 在controller中需要先把$scope复制给可捕获的变量,选择一个有代表性的名称,例如vm代表ViewModel(方便controller as 语法糖之间的切换)

     function Customer ($scope) {
    var vm = $scope;
    vm.name = {};
    vm.sendMessage = function() { };
    }
  6. 可绑定成员放到顶部(注:如果一个函数就是一行,那么只要不影响可读性就把它放到顶部。)

     function Sessions() {
    var vm = this; vm.gotoSession = gotoSession;
    vm.refresh = refresh;
    vm.search = search;
    vm.sessions = [];
    vm.title = 'Sessions'; //////////// function gotoSession() {
    /* */
    } function refresh() {
    /* */
    } function search() {
    /* */
    }
    }
  7. 保持Controller的专一性,一个view定义一个controller,尽量不要在其它view中使用这个controller。把可重用的逻辑放到factory中,保证controller只服务于当前视图

  8. 独立的数据调用(Data Services):

    • 把进行数据操作和数据交互的逻辑放到factory中,数据服务负责XHR请求、本地存储、内存存储和其它任何数据操作
    • 数据服务被调用时(例如controller),隐藏调用的直接行为
    • 数据调用返回一个Promise
  9. Directives

    • 一个dirctive一个文件
    • 提供一个唯一的Directive前缀,格式:{namespace}-指令名称
  10. 压缩处理(防止压缩导致出错):

    • 手动添加依赖

        angular
      .module('app')
      .controller('Dashboard', Dashboard); Dashboard.$inject = ['$location', '$routeParams', 'common', 'dataservice']; function Dashboard($location, $routeParams, common, dataservice) {
      }
  11. Controller命名: 使用UpperCamelCase(每个单词首字母大写)的方式;后缀使用Controller;例如:AvengersController

  12. Service命名: 对service和factory使用camel-casing(驼峰式,第一个单词首字母小写,后面单词首字母大写)方式。避免使用$前缀。

  13. Directive组件命名: 使用camel-case方式,用一个短的前缀来描述directive在哪个区域使用(一些例子中是使用公司前缀或是项目前缀)

Angularjs书写规范的更多相关文章

  1. CSS书写规范、命名规范、网易CSS框架NEC

    网易CSS框架NEC:http://nec.netease.com/ NEC框架的CSS规范:  CSS规范 - 分类方法 CSS规范 - 命名规则 CSS规范 - 代码格式 CSS规范 - 优化方案 ...

  2. html和css书写规范

    HTML 规范 分离的标记.样式和脚本 结构.表现.行为分离 在可能情况下验证你的标记 使用编辑器验证你的标记是否正确,一般编辑器都自带有这个功能. 技术不支持的时候使用备胎,如canvas 编码格式 ...

  3. 数据库DDL语句书写规范

    数据库DDL语句书写规范 1.SQL语句编写说明编写SQL语句应遵循统一的规范,包括大小写.空格.换行.缩进等等,只有完全一样的SQL才能在数据库中共享,从而减少硬解析. 字段类型.长度:根据数据情况 ...

  4. CSS书写规范

    一.CSS书写顺序 1.位置属性(position,top,right,z-index,display,float等) 2.大小(width,height,padding,margin) 3.文字系列 ...

  5. 推荐大家使用的CSS书写规范、顺序

    写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...

  6. 分享给大家的CSS书写规范、顺序

    写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...

  7. css命名书写规范小结。

    单行形式书写风格的排版约束 1.   每一条规则的大括号 { 前后加空格 2.   多个selector共用一个样式集,则多个selector必须写成多行形式 3.   每一条规则结束的大括号 } 前 ...

  8. CSS书写规范及顺序

    CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3. ...

  9. [Java拾遗一] XML的书写规范与解析.

    前言今天天气大好, 起了个大早开始总结一些常用的基础知识. XML一直来说都很陌生, 使用大多是用于配置文件, 之前并没有细究过其中的约束规范, 今天刚好没事来学习并总结下. 1,XML基础介绍 XM ...

随机推荐

  1. 如何查看Ubuntu版本

    有时候需要查看一下系统安装的Ubuntu的版本,最简单的方式是输入lsb_release -a. whatis lsb_release输出:print distribution-specific in ...

  2. 【leetcode】395. Longest Substring with At Least K Repeating Characters

    题目如下: 解题思路:题目要找出一段连续的子串内所有字符出现的次数必须要大于k,因此出现次数小于k的字符就一定不能出现,所以就可以以这些字符作为分隔符分割成多个子串,然后继续对子串递归,找出符合条件的 ...

  3. Python--面向对象的程序设计之组合应用、开发软件规范

    组合应用: class Teacher: def __init__(self,name,age,sex,salary,level): self.name=name self.age=age self. ...

  4. 【软工项目Beta阶段】第11周Scrum会议博客

    第十一周会议记录 小组GitHub项目地址https://github.com/ouc-softwareclass/OUC-Market 小组Issue地址https://github.com/ouc ...

  5. 处理post上传的文件;并返回路径

    /** * 处理post上传的文件:并返回路径 * @param string $path 字符串 保存文件路径示例: /Upload/image/ * @param string $format 文 ...

  6. Windows Server服务器之介绍及版本信息

    Windows Server是Microsoft Windows Server System(WSS)的核心,Windows的服务器操作系统.每个Windows Server都与其家用(工作站)版对应 ...

  7. Vue.config.optionMergeStrategies 用法分析

    举个例子,假设有个对象,他叫objA, 技能是说hello,他喜欢的女生叫小花,但是他是一个花心的人! objA = { name: 'objA ', sayHello_ () { console.l ...

  8. Hive 窗口函数

    举例: row_number() over(partition by clue_id order by state_updated desc) 业务举例: select distinct a.clue ...

  9. HTTP超详细总结

    HTTP协议概述 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于从万维网(WWW:World Wide Web )服务器传输超文本到本地浏览器的 ...

  10. JAVA中一个汉字占多少个字符(转载)

    1.先说重点: 不同的编码格式占字节数是不同的,UTF-8编码下一个中文所占字节也是不确定的,可能是2个.3个.4个字节: 2.以下是源码: 1 @Test 2 public void test1() ...