Angular 技术栈

指令
路由
rxjs
组件传参

    "angular": "1.3.0",
    "jquery": "~2.1.1",
    "angular-ui-router": "~0.2.15",
    "angular-bootstrap": "~0.13.0",
    "angular-translate": "~2.7.2",
    "angular-translate-loader-url": "~2.8.1",
    "angular-animate": "1.3.0",	动画插件
    "angular-bindonce": "0.3.3",	一次性数据绑定
    "ng-table": "~0.8.3",
    "angular-slider": "~0.2.15",	滑块指令
    "angular-translate-loader-static-files": "~2.8.1",	国际化配置语言		

    "angular-amchart": "~1.0.6",	图表
    "amcharts3": "~3.17.2",	图表
    "angular-i18n": "~1.4.7",	延迟加载 i18n数据的异步加载
    "angular-mocks": "1.3.0",
    "angular-file-upload": "~2.2.0",	文件上传
    "angular-breadcrumb": "~0.4.1",	面包屑
    "showdown": "~1.3.0",
    "jquery-zclip": "~1.1.5",
    "ng-scrollbar": "~0.0.8",	滚动条
    "angular-cookies": "1.3.0",
    "oclazyload": "^1.0.9",	延迟加载
    "angular-loading-bar": "^0.9.0"	自动加载

··································
AngularJS

ui-router 0.2.15
npm install --save @uirouter/angularjs@1.0.7

.filter .controller等等等 是angularjs的方法 有些类似于js原生链

gulpfile.js										服务器地址
bower.json
src/monitor										监控页面
src/lib/js							引入angular jquery包	
src/lib/js/angular-amchart.js		AngularAmChart	.module
amchart													.directive
src/common/angularAmchartsModule/amchartsModule.js	.module
amchart													.directive
src/login											登录页面
src/index.pug								    主入口 左侧栏 头部 main
src/common											自定义标签
src/index/js/domeApp.js							路由
src/index/js/common/commonDialogs.js			修改密码 header头部
src/index/js/directives							.diretive
src/index/js/directives/domeDirective.js		页码
src/index/js/directives/domeValidation.js		验证用户是否存在
src/index/js/services							.factory
src/index/js/filter.js							分页过滤
src/index/mainpage		    管理左侧导航栏 .controller header头部
src/index/tpl										组件


模板引擎
npm install pug-cli -g

目录结构
App是被src解析之后的html App是入口
bower.json 包管理工具
Pug模板引擎

Pug 
npm install pug-cli -g

eventList 	在src/common/formInputs/formInputs里		.component
pageContentBox 在src/common/pageLayout.js里	 		.directive
eventList 	在src/common/formInputs/formInputs里		.component
src/common/pageLayout/page	
src/common/pageLayout.js									.directive
pageContainer	pageContentBox
src/common/formInputs/formInputs	formInputs.js		.component	
titleLine formHelpLine 		eventList				
自定义的 就是公共组件


- var声明变量 取值#{}解析	=相当于#		()属性		if else
-for(var i in)		each val,index in		includes
Extends		|段落			//注释		


ng-app 	ng-controller	{{}}解析 	ng-model双向绑定 ng-init	
ng-bind “”解析变量		ng-repeat循环		.directive自定义指令 元素名 属性 类名调用
| uppercase	| lowercase
ng-click	ng-cloak	ng-pattern		on-change	ng-if	|		ng-class         
ng-disabled
filter过滤	orderby排序

a标签 ui-sref 跳转路径

js
$scope js中定义变量		$modal		$modalInstance	$domeImage		$util		$http		$domeAppStore			$domeUser		
$interval		$timeout		dialog		
.controller .filter		$state.go路由跳转		$state.$current.name		$q promise			$cookieStore		


.provider		创建service	 	
.factory自定义方法创建service 		自定义服务			return	
.service		创建service	
.directive自定义指令pug用								return
.filter自定义过滤器		$filter()()	pug中使用|	3种方式
.component pug用					
.module依赖注入			


内置服务	$http $timeout $interval $location $watch $q $log $emit $on
$ctrl

$domeAppStore在js/service/domeService.js				.factory
$domeGlobal 在在js/service/domeService.js				.factory
$domeImage	在common/imageModule/imageModule.js
$domeUser在 common/userModule/userModule.js			.factory

api在	common/backendApi/backendApi.js			依赖注入

注入的都是自定义方法





Ingdex/js/common/		
Ingdex/js/services/		接口都在这里写	$http
Ingdex/js/directives/	指令
Ingdex/js/filter.js		分页过滤


template	bindings	controller里写js


··································
Angular2 Angular7	
*ngFor	*ngIf	属性绑定[]	解析{{}}	事件绑定(click)=‘share()’
[()] 双数据绑定
创建一个新组件Angular Generator	ts	angular file 插件	Generate Component

Component.ts			引入html css	service	@Component

Module.ts				引入component service routing 所有的				@NgModule

Service.ts		@Injectable
Routing.module.ts		引入component	@NgModule

	
import { Component, OnInit } from '@angular/core'; 
import { Input } from '@angular/core';

··································
TypeScript ES6超集
元祖Tuple 	: [string, number]
Any			let list: any[] = [1, true, "free"]; 		list[1] = 100;
Object	let