-
Notifications
You must be signed in to change notification settings - Fork 0
/
search.xml
84 lines (58 loc) · 29.3 KB
/
search.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title><![CDATA[PHP用抛物线的模型实现微信红包生成算法]]></title>
<url>%2F2017%2F05%2F21%2Farithmetic-redpackets%2F</url>
<content type="text"><![CDATA[红包生成算法 红包的向平均数集中的分布正像数学上的抛物线。抛物线y=ax2,|a|越大则抛物线的开口就越小,|a|越小则抛物线的开口就越大,a>0时开口向上 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103<?php/* *Note:红包生成随机算法 */ header("Content-type:text/html;charset=utf-8");date_default_timezone_set('PRC');#红包生成的算法程序class reward{ public $rewardMoney; #红包金额、单位元 public $rewardNum; #红包数量 public $scatter; #分散度值1-10000 public $rewardArray; #红包结果集 #初始化红包类 public function __construct() { $this->rewardArray=array(); } #执行红包生成算法 public function splitReward($rewardMoney,$rewardNum,$scatter=100) { #传入红包金额和数量 $this->rewardMoney=$rewardMoney; $this->rewardNum=$rewardNum; $this->scatter=$scatter; $this->realscatter=$this->scatter/100; /* *前言:今天我突然这样一想,比如要把1个红包分给N个人,实际上就是相当于要得到N个百分比数据 * 条件是这N个百分比之和=100/100。这N个百分比的平均值是1/N。 * 并且这N个百分比数据符合一种正态分布(多数值比较靠近平均值) *观点:微信红包里很多0.01的红包,我觉得这是微信程序里的人为控制,目的是为了防止总红包数超过总额,先分了几个0.01的红包。 * 不然不管是以随机概率还是正态分布都很难会出现非常多的0.01元红包。 */ #我的思路:正如上面说的,比如:1个红包发给5个人,我要得出5个小数,它们的和是1,他们的平均值是1/5 #计算出发出红包的平均概率值、精确到小数4位。即上面的1/N值。 $avgRand=round(1/$this->rewardNum,4); #红包的向平均数集中的分布正像数学上的抛物线。抛物线y=ax2,|a|越大则抛物线的开口就越小,|a|越小则抛物线的开口就越大,a>0时开口向上,我们这都是正数,就以a>0来考虑吧。 #程序里的$scatter值即为上方的a,此值除以100,当做100为基准, #通过开方(数学里的抛物线模型,开方可缩小变化值)得出一个小数字较多(小数字多即小红包多)的随机分布,据此生成随机数 $randArr=array(); while(count($randArr)<$rewardNum) { $t=round(sqrt(mt_rand(1,10000)/$this->realscatter)); $randArr[]=$t; } #计算当前生成的随机数的平均值,保留4位小数 $randAll=round(array_sum($randArr)/count($randArr),4); #为将生成的随机数的平均值变成我们要的1/N,计算一下生成的每个随机数都需要除以的值。我们可以在最后一个红包进行单独处理,所以此处可约等于处理。 $mixrand=round($randAll/$avgRand,4); #对每一个随机数进行处理,并剩以总金额数来得出这个红包的金额。 $rewardArr=array(); foreach($randArr as $key=>$randVal) { $randVal=round($randVal/$mixrand,4); $rewardArr[]=round($this->rewardMoney*$randVal,2); } #对比红包总数的差异、修正最后一个大红包 sort($rewardArr); $rewardAll=array_sum($rewardArr); $rewardArr[$this->rewardNum-1]=$this->rewardMoney-($rewardAll-$rewardArr[$this->rewardNum-1]); rsort($rewardArr); #对红包进行排序一下以方便在前台图示展示 foreach($rewardArr as $k=>$value) { $t=$k%2; if($t) array_push($this->rewardArray,$value); else array_unshift($this->rewardArray,$value); } $rewardArr=NULL; return $this->rewardArray; } }$money=1000; #总共要发的红包数;$people=50; #总共要发的人数$scatter=100; #分散度$reward=new reward();$rewardArr=$reward->splitReward($money,$people,$scatter);echo "发放红包个数:{$people},红包总金额{$money}元。下方所有红包总额之和:".array_sum($reward->rewardArray).'元。下方用图展示红包的分布';echo '<hr>';echo "<table style='font-size:12px;width:600px;border:1px solid #ccc;text-align:left;'><tr><td>红包金额</td><td>图示</td></tr>";foreach($rewardArr as $val){ #线条长度计算 $width=intval($people*$val*300/$money); echo "<tr><td>{$val}</td><td width='500px;text-align:left;'><hr style='width:{$width}px;height:3px;border:none;border-top:3px double red;margin:0 auto 0 0px;'></td></tr>"; }echo "</table>";?>]]></content>
</entry>
<entry>
<title><![CDATA[angualr注入器]]></title>
<url>%2F2017%2F04%2F26%2Fangualr-Injector%2F</url>
<content type="text"><![CDATA[Angular依赖注入 依赖注入(Dependency Injection)简称DI,目的是简化软件组件中的依赖关系管理。 通过减少组件需要知道的关于其依赖性的信息量,单元测试可以变得更容易,并且代码更可能是灵活的。 注入器: 1constructor(private productService: ProductService) {......} 123456//非常难以测试,框架修改者适用private productService: ProductService;constructor(private _injector: Injector ProductService) { this.productService = _injector.get(ProductService);} 提供器: 1234providers:[ProductService]providers:[{provide:ProductService, useClass:ProductService}]providers:[{provide:ProductService, useClass:AnotherProductService}]providers:[provide:ProductService,useFactory:()=>{...}] 12345678910111213providers: [{ provide: ProductService, UseFactory: (loggerService: LoggerService, isDev) => { if(isDev.is_dev) { return new ProductService(loggerService); }else { return new AnotherProductService(loggerService); } }, deps: [LoggerService, 'IS_DEV_ENV']},LoggerService,{ { provide: 'IS_DEV_ENV', useValue: {is_dev: true}}}] 提供器树:应用及提供器 > 根组件提供器 > 子组件提供器(angular只有一种注入方式,就是构造方式注入)]]></content>
</entry>
<entry>
<title><![CDATA[angular路由]]></title>
<url>%2F2017%2F04%2F24%2Fangular-router%2F</url>
<content type="text"><![CDATA[使用Angular Route实现导航 路由允许我们在URL中表达应用程序某种状态。与服务器端前端解决方案不同,这是可选的我们可以在不更改URL的情况下构建完整的应用程序。 然而,添加路由允许用户直接进入应用程序的某部分。 这非常方便,因为它可以保持您的应用程序可链接并且可以被添加为书签,还允许用户与他人分享链接。 路由定义与配置路由可以让你: 保持应用程序的状态 实现模块化应用 基于角色实现应用程序(某些角色可以访问某些URL) 名称 简介 Routes 路由配置,保存URL=>Component,在RouterOutlet中展示组件。 RouterOutlet 在Html中标记路由内容,呈现位置的占位符指令。 Router 负责在运行时执行路由的对象,通过调用navigate()和navigateByUrl()方法来导航到一个指定的路由。 RouterLink 在html中声明路由导航用的指令 ActivatedRoute 当前激活的路由对象,保存着当前路由的信息,如路由地址,路由参数等。 创建上图实例: 12345ng new project --routingng g component ang g component bng g component cng g component code404 file: app-routing.module.ts 12345678910111213......const routes: Routes = [ {path: '', redirectTo: 'a', pathMatch: 'full'},//当应用程序启动时,默认情况下导航到空路由。默认情况下,我们可以配置路由重定向到命名路由:redirectTo: 'a'。 {path: 'a', component: AComponent}, {path: 'b', component: BComponent, children: [ {path: '', redirectTo: 'c', pathMatch: 'full'}, {path: 'c', component: CComponent} ]},//当某些路由只能在其他路由中访问和查看时,可能适合将其创建为子路由。 children: [....] {path: '**', component: Code404Component}//`**`通配符页面不存在则显示该页面]; file: app.component.html 1234567891011......<a [routerLink]="['a']">a</a><a [routerLink]="['b']">b</a><input type="button" value="button" (click)="toBComponent()"><RouterOutlet></RouterOutlet>file: app.component.ts.......toBComponent() { this._router.navigate(['/order']);} file:b.component.html 123.......<a [routerLink]="['./c']">children-c</a> // => url: localhost/b/c<RouterOutlet></RouterOutlet> 使用路由参数假设我们正在创建一个显示产品列表的应用程序。当用户点击列表中的产品时,我们.要显示一个页面,显示该产品的详细信息。为此你必须实现以下三步: 1.添加路由参数ID 显示特定产品详细信息的组件的路由需要该产品ID的路由参数。我们可以使用以下Router实现:12345export const routes: Routes = [ { path: '', redirectTo: 'product-list', pathMatch: 'full' }, { path: 'product-list', component: ProductList }, { path: 'product-details/:id', component: ProductDetails }]; 2.将路由链接到参数 在ProductList组件中,您可以通过ID显示产品列表。每个产品都有一个链接到product-details的路由: 123goToProductDetails(id) { this.router.navigate(['/product-details', id]);} 3.添加读取参数的服务 ActivatedRoute上的params属性是一个Observable的原因是路由器在导航到同一个组件时可能无法重新创建组件。在这种情况下,参数可能会改变,而不会重新创建组件。 123456789ngOnInit() { this.sub = this._activatedRoute.params.subscribe(params => { this.id = +params['id']; }); }ngOnDestroy() { this.sub.unsubscribe(); } 三种传递路由数据方式查询参数和路由参数之间的关键区别在于路由参数对于确定路由是必要的,而查询参数是可选的。 1.在查询参数中传递数据 1234/product?id=1&name=2=>ActivatedRoute.queryParams[id]或=>ActivatedRoute.queryParams[name] 2.在路由路径中传递数据 123{path:/product/:id}=>/product/1=>ActivateRoute.params[id] 3.在路由配置中传递数据 12{path:/product, component: ProductComponent, data:[{isProd:true},....]}=>ActivatedRoute.data[0][isProd] 辅助路由 每个组件具有一个主路由和零个或多个辅助出口。 辅助出口必须在组件中具有唯一的名称。每个辅助路由是独立的路由,可以拥有:自己的子路由、自己的辅助路由、自己的路由参数、自己的浏览器历史记录栈。 file:app-routing.module.ts 1234const routes: Routes = [{path: 'component-one', component: 'OneComponent'},{path:'component-aux', component: 'AuxComponent', outlet: 'sidebar'}]; file:app.component.html 12345<a [routerLink]="['/component-one']">component-one</a><a [routerLink]="[{outlets:{'primary':['component-one'],'sidebar':['component-aux']}}]">Component Aux</a><router-outlet></router-outlet><router-outlet name="sidebar"></router-outlet> 路由拦截 | 守卫:使用路由哨兵控制用户是否可以导航到指定路由。例如,我们可能希望一些路线只有在用户登录或接受条款和条件后才可访问。 我们可以使用路由哨兵来检查这些条件并控制对路由的访问。 路由哨兵还可以控制用户是否可以离开某个路由。例如,假设用户已将信息键入页面上的表单,但尚未提交表单。 如果这时离开页面,他们将丢失信息。 如果用户尝试离开路由而不是提交或保存信息,我们可以提示用户。 Angular 提供了五种路由拦截守卫:名称 | 简介— | —CanActive | 激活拦截:处理导航到某路由的情况。CanActiveChild | 激活拦截:处理导航到子路由的情况。CanDeactivate | 反激活拦截:处理从当前路由离开的情况。Resolve | 数据预加载拦截:在路由激活之前获取路由数据。CanLoad | 模块预加载拦截:处理异步导航到某特性模块的情况。 例如,假设我们有一个accounts 路由,只有登录的用户可以访问。 此页面还有表单,我们希望确保用户在离开帐户页面之前提交了未保存的更改。 1.首先在路由上注册路由守卫。 LoginRouteGuard将在accounts 路由激活时检查,SaveFormsGuard将在离开该路由时被检查。 1234567891011121314151617181920const routes: Routes = [ { path: 'home', component: HomePage }, { path: 'accounts', component: AccountPage, canActivate: [LoginRouteGuard], //激活时 canDeactivate: [SaveFormsGuard] //离开时 }, { path: 'product', component: ProductPage, resolve: { product: ProudctResolve } },];@NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule], providers: [LoginRouteGuard, SaveFormsGuard], //声明注入 }) 2.实现CanActivate 当canActivate返回true时,用户可以激活路由。 当canActivate返回false时,用户无法访问路由。 1234567891011121314import { CanActivate } from '@angular/router';import { Injectable } from '@angular/core';import { LoginService } from './login-service';//这个类通过实现canActivate函数实现了CanActivate功能@Injectable()export class LoginRouteGuard implements CanActivate { constructor(private loginService: LoginService) {} canActivate() { return this.loginService.isLoggedIn(); }} 3.实现 CanDeactivate CanDeactivate的工作方式与CanActivate类似,但有一些重要的区别。 canDeactivate函数将被禁用的组件作为参数传递给函数。 1234567891011import { CanDeactivate } from '@angular/router';import { Injectable } from '@angular/core';import { AccountPage } from './account-page';@Injectable()export class SaveFormsGuard implements CanDeactivate<AccountPage> { canDeactivate(component: AccountPage) { return window.confirm('不保存退出?'); }} 4.实现Resolve 1234567891011121314@Injectable()export class ProudctResolve implements Resolve<Product> { constructor(private _router: Router) {} resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Product | Observable<Product> | Promise<Product> { const productId: number = +route.params['id']; if (productId === 1) { return new Product(1, 'apple'); }else { this._router.navigate(['/']); } }}]]></content>
</entry>
<entry>
<title><![CDATA[angualr引入第三方库(Jquery、Bootstrap)]]></title>
<url>%2F2017%2F04%2F21%2Fangular-import-lib%2F</url>
<content type="text"><![CDATA[场景说明:项目需要使用bootstrap,众所周知bootstrap没有时间日期控件的,需要使用第三方控件,项目使用angular-cli构建的。 解决流程(三步)1.下载第三方依赖库到本地12npm install jquery --savenpm install bootstrap --save 在package.json文件中可以查看新导入的库,’–save’将jquery库记录到package.json文件中。 2.将库引入到项目中在项目node_modules查找新导入库包,复制路径,引入到angular-cli.json文件里。123456789"styles": [ ........ "../node_modules/bootstrap/dist/css/bootstrap.css" ],"scripts": [......... "../node_modules/jquery/dist/jquery.js", "../node_modules/bootstrap/dist/js/bootstrap.js" ], 3.下载类型描述文件Angular区别于AngularJS,重构后使用TypeScript编写,第三方库需要引入@types类型描述文件,否则在IDE中会显示语法错误。12npm install @types/jquery --save-devnpm install @types/bootstrap --save-dev O(∩_∩)O现在可以愉快的使用Jquery了!]]></content>
</entry>
<entry>
<title><![CDATA[angular开发环境搭件(WebStorm,Angular-cli)]]></title>
<url>%2F2017%2F04%2F21%2Fangular-ready%2F</url>
<content type="text"><![CDATA[自己尝试用WebStorm搭建Angular的工程,虽然在网上看了一些仁兄的帖子,很有帮助,但是感觉关键的、核心的问题没有说清楚(也可能是由于用Node不是很久,知识浅薄),所以搭建过程特别是在Windows上也是磕磕绊绊,总是有些问题。相信其他人也会遇到同样的问题,所以将问题梳理总结如下。 环境准备 应用 版本 WebStorm 2017.1.1 NodeJs v7.9.0 angular/cli 1.0.0 OS windows win32 x64 WebStorm安装下载安装WebStorm2017版(Download | 下载)WebStorm安装很简单,破解如图,建议还是支持正版。 NodeJs安装下载安装NodeJs(Download | 下载)这一步很简单,下载Windows版的Nodejs,进行按照提示安装即可,记得选择将nodejs增加到PATH一项,如果界面上没有,应该就是默认帮你搞定了,可以忽略我这句废话。通过命令,验证是否安装成功:12node -v //如果正常显示版本号,即安装成功。npm -v Nodejs配置Nodejs安装完成之后,默认会将node.exe的路径,添加到系统的环境变量中,如果没有请手动添加。除此之外还要进行其他的配置。1.配置prefix和cache目录123456示例目录地址为:C:\Program Files\nodejscd C:\Program Files\nodejsmkdir node_global\node_modules //创建目录mkdir node_cachenpm config set prefix "C:\Program Files\nodejs\node_global"npm config set cache "C:\Program Files\nodejs\node_cache" 2.配置环境变量右击“计算机”—>”属性”—>”高级系统设置”—>”环境变量”12345在[系统变量]中,设置 NODE_PATH ,新建 NODE_PATH ,值为C:\Program Files\nodejs\node_global\node_modules在”用户变量”中,修改用户变量中的path,添加C:\Program Files\nodejs\node_global\ 3.配置sass_binary手工下载node-sass (Download | 下载) angular cli 是要依赖node-sass的,默认情况下,不会像其它包一样直接下载,而是要下载后进行编译的。在Windows下,首先要通过git下载win32-x64-51_binding.node,但是不知道是被墙还是什么原因,下不下来,就会导致后面的编译出错,以及提示找不到python和Visual Studio的问题。 12345678910111213将下载的binding.node放到指定目录,例如:C:\win32-x64-51_binding.node执行配置命令:npm config set sass_binary_path "C:\win32-x64-51_binding.node"npm config set sass_binary_site “https://npm.taobao.org/mirrors/node-sass/” //使用阿里的镜像当然以上prefix, cache,sass_binary_site, sass_binary_path等,也可以通过修改下面文件进行配置:C:\<username>\.npmrcprefix=C:\Program Files\nodejs\node_globalcache=C:\Program Files\nodejs\node_cachesass_binary_site=https://npm.taobao.org/mirrors/node-sass/sass_binary_path=C:\win32-x64-51_binding.node 4.全局安装typescript | typings1npm install -g typescript typings 5.全局安装angularjs-cli新版已经不用angular-cli进行安装,而是使用@angular/cli,参见官网1npm install -g @angular/cli 创建工程1.打开WebStorm新建一个Angualr CLI 工程 2.等待工程创建完成以上工作完成,就是等待新建一个angular 2工程。这个过程有点慢,主要是IDE会根据package.json下载依赖的包到工程里面。 3.运行程序选择package.json, 右键选择“Show npm Scripts”,或者用“Edit Configurations”,添加“npm” 4.点击“start” 启动 Web Server 5.在浏览器輸入 http://localhost:4200 ,若出現 app works! ,表示Angular已经正常启动。 (Win10主机 最好“以管理员身份运行”系统!避免权限不足等问题!)]]></content>
</entry>
<entry>
<title><![CDATA[hexo指令]]></title>
<url>%2F2017%2F04%2F19%2Fhexo%2F</url>
<content type="text"><![CDATA[init1$ hexo init [folder] 新建一个网站。如果没有设置 folder ,Hexo 默认在目前的文件夹建立网站。 new1$ hexo new [layout] <title> 新建一篇文章。如果没有设置 layout 的话,默认使用 _config.yml 中的 default_layout 参数代替。如果标题包含空格的话,请使用引号括起来。 generate1$ hexo generate 生成静态文件。 选项 描述 -d, --deploy 文件生成后立即部署网站 -w, --watch 监视文件变动 该命令可以简写为1$ hexo g publish1$ hexo publish [layout] <filename> 发表草稿。 server1$ hexo server 启动服务器。默认情况下,访问网址为: http://localhost:4000/。 选项 描述 -p, --port 重设端口 -s, --static 只使用静态文件 -l, --log 启动日记记录,使用覆盖记录格式 deploy1$ hexo deploy 部署网站。 参数 描述 -g, --generate 部署之前预先生成静态文件 该命令可以简写为:1$ hexo d render1$ hexo render <file1> [file2] ... 渲染文件。 参数 描述 -o, --output 设置输出路径 migrate1$ hexo migrate <type> 从其他博客系统 迁移内容。 clean1$ hexo clean 清除缓存文件 (db.json) 和已生成的静态文件 (public)。 在某些情况(尤其是更换主题后),如果发现您对站点的更改无论如何也不生效,您可能需要运行该命令。 list1$ hexo list <type> 列出网站资料。 version1$ hexo version 显示 Hexo 版本。 选项安全模式1$ hexo --safe 在安全模式下,不会载入插件和脚本。当您在安装新插件遭遇问题时,可以尝试以安全模式重新执行。 调试模式1$ hexo --debug 在终端中显示调试信息并记录到 debug.log。当您碰到问题时,可以尝试用调试模式重新执行一次,并 提交调试信息到 GitHub。 简洁模式1$ hexo --silent 隐藏终端信息。 自定义配置文件的路径1$ hexo --config custom.yml 自定义配置文件的路径,执行后将不再使用 _config.yml。 显示草稿1$ hexo --draft 显示 source/_drafts 文件夹中的草稿文章。 自定义 CWD1$ hexo --cwd /path/to/cwd 自定义当前工作目录(Current working directory)的路径。]]></content>
</entry>
<entry>
<title><![CDATA[nrm切换npm源利器]]></title>
<url>%2F2017%2F04%2F19%2Fnrm%2F</url>
<content type="text"><![CDATA[在使用npm时,官方的源下载npm包会比较慢,国内我们基本使用淘宝的源,最近公司内部搭建了一套npm私有仓库。要添加自己公司内部的npm源,公司内部的源不可能把npm官方的npm包都全量同步,故需要npm源之间的切换,如果使用npm registry xxx的话,太不好管理了。nrm是管理npm源切换的利器。使用方法如下: 首先安装nrm包:1npm install -g nrm 查看nrm帮助:1nrm -h | -help 1234567891011121314151617Usage: cli [options] [command]Commands: ls List all the registries current Show current registry name use <registry> Change registry to registry add <registry> <url> [home] Add one custom registry del <registry> Delete one custom registry home <registry> [browser] Open the homepage of registry with optional browser test [registry] Show response time for specific or all registries help Print this helpOptions: -h, --help output usage information -V, --version output the version number 主要使用ls和use命令: nrm ls 是列出来现在已经配置好的所有的源地址; 1nrm ls 1234567* npm ---- https://registry.npmjs.org/ cnpm --- http://r.cnpmjs.org/ taobao - https://registry.npm.taobao.org/ nj ----- https://registry.nodejitsu.com/ rednpm - http://registry.mirror.cqupt.edu.cn/ npmMirror https://skimdb.npmjs.com/registry/ edunpm - http://registry.enpmjs.org/ nrm use 是切换到哪个源上; 1nrm usr taobao nrm add 添加源; 1nrm add abc https://abc.npmjs.org 12345678 npm ---- https://registry.npmjs.org/ cnpm --- http://r.cnpmjs.org/* taobao - https://registry.npm.taobao.org/ nj ----- https://registry.nodejitsu.com/ rednpm - http://registry.mirror.cqupt.edu.cn/ npmMirror https://skimdb.npmjs.com/registry/ edunpm - http://registry.enpmjs.org/ abc ---- https://abc.npmjs.org/ [新添加的镜像源] nrm del 删除源; 1nrm del abc nrm test 测试源的响应时间,可以作为使用哪个源的参考; 1nrm test 1234567 npm ---- 2105ms cnpm --- 313ms* taobao - 266ms nj ----- Fetch Error rednpm - 425ms npmMirror 3561ms edunpm - Fetch Error]]></content>
</entry>
<entry>
<title><![CDATA[Angular 快速上手]]></title>
<url>%2F2017%2F02%2F10%2Fng2-chapter-1%2F</url>
<content type="text"><![CDATA[内容提要第一块内容:Angular-CLI安装配置Angular CLI主要特性 在开发中,搭建一个良好的前端架构非常重要,他对后续的开发,维护,团队协作,易读性具有重要意义 Angular CLI 可以快速搭建框架,创建module,service,class,directive等; 具有webpack的功能,代码分割(code splitting),按需加载; 代码打包压缩; 模块测试,端到端测试; 热部署,有改动立即重新编译,不用刷新浏览器;而且速度很快 有开发环境,测试环境,生产环境的配置,不用自己操心; sass,less的预编译Angular CLI都会自动识别后缀来编译; typescript的配置,Angular CLI在创建应用时都可以自己配置; 在创建好的工程也可以做一些个性化的配置,webpack的具体配置还不支持,未来可能会增加; Angular CLI创建的工程结构是最佳实践,生产可用; 安装 Angular CLI123npm install -g angular-cli // 需要翻墙你懂的!ng --versionng help 创建Aangular2工程1ng new project_name // project_name是你的项目名; 启动Aangular2工程123cd project_name ng serve // 运行ng serve --port 4201 --live-reload-port 49153 // 也可以指定运行 CLI操作命令123456789ng generate component my-new-component // 全写 快速生产组件ng g c my-new-component // 简写 g:generate | c:componentng g directive my-new-directive // d:Directiveng g pipe my-new-pipe // p:Pipeng g service my-new-service // s:Serviceng g interface my-new-interface // Interfaceng g enum my-new-enum // e:Enumng g module my-module // m:Module CLI测试123CLI 实现了 Karma 和 e2e 两种测试ng test // karmang e2e // e2e 第二块内容:Angualr中的3大核心概念 Component、Module、Route 第三块内容:Angualr核心架构思想 组件化、依赖注入DI、数据绑定 第四块内容:UI库 Angular-Material、Prime-NG、ng2-bootstrap、ionic2 第五块内容:NiceFish]]></content>
</entry>
<entry>
<title><![CDATA[Angular 章节目录]]></title>
<url>%2F2017%2F02%2F10%2Fng2-list%2F</url>
<content type="text"><![CDATA[ALL-IN-ONE 平台Angular就是前端开发领域的“宜家套装”,它经过精心的前期设计,涵盖了开发的各个层面,层与层之间都经过了精心调适, 是一个“开箱即用”的框架。你只管在前台秀肌肉吧!剩下的,让Angular在幕后帮你搞定! 课程大纲(更新)第一节:Angular快速上手第二节:搭建开发环境 angular-CLI 、webpack 第三节:组件与指令 组件与指令、模板、数据绑定与事件绑定、组件间通讯、生命周期、动效、服务、管道 第四节:模块与共享模块 第五节:路由与动态加载 基本用法、多层嵌套、动态加载模块、路由守卫 第六节:表单与数据校验第七节:与服务端通讯 Observable与RxJS 第八节:i18n(国际化)第九节:前端自动化测试第十节:高阶内容 WebWorker、ServiceWorker、SEO与Universal、ionic、PWA]]></content>
</entry>
<entry>
<title><![CDATA[ubuntu 常用命令]]></title>
<url>%2F2017%2F02%2F09%2Fubuntu-command%2F</url>
<content type="text"><![CDATA[文件/文件夹管理 列出当前目录文件(不包括隐含文件) 1ls 列出当前目录文件(包括隐含文件) 1ls -a 列出当前目录下文件的详细信息 1ls -l 回当前目录的上一级目录 1cd .. 回上一次所在的目录 1cd - 或 cd 回当前用户的宿主目录 1cd ~ 目录名 创建一个目录 1mkdir 空目录名 删除一个空目录 1rmdir 文件名 文件名 删除一个文件或多个文件 1rm 非空目录名 删除一个非空目录下的一切 1rm -rf 路经/文件 /经/文件移动相对路经下的文件到绝对路经下 1mv 文件名 新名称 在当前目录下改名 1mv 路经 -name “字符串” 查找路经所在范围内满足字符串匹配的文件和目录 1find]]></content>
</entry>
<entry>
<title><![CDATA[ionic2.0.1发布,漂亮的 HTML5 移动应用框架]]></title>
<url>%2F2017%2F02%2F08%2Fionic2-0-1%2F</url>
<content type="text"><![CDATA[Ionic 2.0.1 发布了,Ionic Framework 是个高级的 HTML5 移动端应用框架,是个很漂亮的使用 HTML5 开发混合移动应用前端框架。 更新内容Bug 修复-chip: 在中心对齐图标 -content::在 read dimensions 时检查 this._scroll -datetime::设置不带 formControlName 的 input-has-value 类 -input::添加警报和输入占位符颜色的变量 -input:禁用时不允许聚焦 -platform:正确检测 iPad Pro -toggle/checkbox:允许值在禁用时进行程序化更新 特性-input: 添加 max,min,step 并传递给 native 详情查看:发行日志]]></content>
</entry>
</search>