2017年01月_ChengYz_

原创在css中使用自定义字体

使用css3的#font-face属性@font-face { font-family: <YourWebFontName>; src: <source> [<format>][,<source> [<format>]]*; [font-weight: <weight>]; [font-style: <style>]; } 下面是我使用SourceCo

2017-01-20 13:35:42 720

原创 angular-cli

1.上线打包指定ng build打包的结果是未压缩的，vendor.js大概有3.5mb，网上找到产品模式打包命令ng build --prod打包后vendor.js大概900Kb

2017-01-19 10:40:39 10497 2

原创 bootstrap记录

<div class=" container"> <div class="row"> <div class="row-md-12"> <div class="text-center"> //文本正居中。 <p>text</p> </div> </div> </div>

2017-01-18 18:29:22 546

原创 webpack ------ loaders

1.属性说明module:{ loaders:[ { test:/.\css$/, //文件名正则表达式 loaders:['style','css'], //使用的loader，若多余一个，则用数组包含，并从右至左的顺序执行 include: //包含的路径，也就是只处理这个路径内的文

2017-01-16 13:55:19 313

这里记录学过的webpack搭建服务器，各种服务器功能不同，按需选择。2017年1月16日 11:12:281.webpack-dev-server1.简介webpack-dev-server可以创建一个本地服务器并server我们打包后的代码。代码更改保存后，浏览器自动刷新。2.配置全局安装npm install webpack-dev-server -g或本地安装npm install web

2017-01-16 11:44:30 1756

原创 webpack ------ plugins

这里记录一些我学过的plugins，并将作用与配置记录在这里。遇到不对的地方、不充分的地方，随时学习随时更新。——2017年1月16日 11:00:271.html-webpack-plugin1.1简介html-webpack-plugin可以为你在outpath中自动生成一个index.html文件，并插入script元素引用你打包的结果。1.2用法npm install html-webpa

2017-01-16 11:08:02 798

原创 webpack ------ 遇到的问题记录

1.项目仓库下无法无法安装webpack在项目下安装webpack依赖，npm报错：Refusing to install webpack as a dependency of itself开始没太看明白，后借助下谷歌翻译：拒绝安装webpack作为自身的依赖纳闷为什么我安装webpack，怎么扯到自身了？后来发现在package.json中，我的项目名字是写了个webpack，导致npm认为你

2017-01-16 10:57:02 440

原创关于typescript的疑问

1.typescript是否完全cover ES6？待解决。2.使用es6开发形成的ts模块怎么用webpack打包？3.使用typescript开发形成的ts文件在webpack中如何处理？是否与es6处理方式相同？

2017-01-12 13:47:27 839

原创 angular2系统学习 - 用户输入

1.通过事件获取用户输入当我们想获取用户输入时，首先想到的就是事件。通过事件我们可以获取event对象，然后通过event对象可以获取元素及事件的一切信息。onClickItem($event: any){ let el = $event.target; ...}缺点暴露太多信息，我们只想要目标元素，但还获取了event对象的其他信息。下面将介绍如何用模板引用变量来解决这个问题

2017-01-11 18:01:06 3206 1

原创 openlayers3 自定义打包

1.简介首先放一个启发我的文章：http://www.jianshu.com/p/d06d58804414ol有很多库，有时候我们只需要部分，比如map,view.layer等。如果把整个文件都引入项目，有些浪费资源且文件过大，与最小化的思路相违。这时候就需要单独打包这些内容，这也是这边记录的主要内容，如何自定义打包我们需要的库？2.创建配置文件1.下载openlayer: npm i open

2017-01-10 15:21:10 4086

原创 angular2系统学习 - 结构型指令

1.简介ng2中指令可分为三种： - 组件 - 属性型指令 - 结构型指令结构型指令通过添加和删除DOM元素来改变DOM的布局。常用指令如：ngIf, ngSwitch, ngFor。html5中使用template标签来防止隐藏的内容，而在ng2中，遇到template标签会将之替换成空的script标签。2.ngSwitch由于在教程中没有用过ngSwitch，而ngIf，ngFor用的

2017-01-09 10:27:11 1148

原创 angular2系统学习 - 疑问

1.自定义指令内HostListener绑定的方法怎么传事件对象event参数？

2017-01-07 21:28:29 588

原创 angular2系统学习 - 属性型指令

1.简介ng2中有三种类型的指令： - Component 组件-拥有模版的指令 - Structural directives 结构型指令-通过添加和移除DOM元素改变DOM布局 - Attribute directives 属性型指令-改变元素的显示和行为概括：属性型指令通过属性绑定在元素上，等于是在DOM加载元素的时候添加了一个拦截器，这个拦截器里可以获取元素，然后改变元素的

2017-01-06 23:30:35 4722 2

原创 angular2系统学习 - 管道

1.简介管道可以在模板中转换显示的内容。往管道中传入数据，然后管道转换数据，再返回出来。2.使用管道{{ inputData | PipeName:args1,args2...}}inputData：输入数据‘|’：管道操作符PipeName：管道名args1,args2…：可选参数。3.链式管道{{ inputData | PipeNameA:args | PipeNameB:args

2017-01-06 18:26:03 2014 1

原创 angular2系统学习 ------杂项

1.js事件与angular2事件映射onfocus - mouseenteronmouseout - mouseleave2.接口实现接口不一定非要在类名后面implements 声明，只需要实现或不实现即可。3.类同名冲突问题。加入有连个相同的文件相同的类，存在于不同的文件夹中，我们在组件中引入时为防止冲突，可以暂时更改映射类名来解决问题。import { AClass as BClass

2017-01-05 15:01:06 772 1

原创 angular2系统学习 - 路由与导航(5)

angular2系统学习 - 路由与导航(5)1.Resolve守卫Resolve守卫主要是在路由激活之前获取路由数据，预先加载数据，且数据加载完成后路由才返回true，以保证导航至该路由时不用现去服务取数据。1.1配置Resolve守卫创建守卫文件resolve.service.ts import { Router, Resolve, ActivatedRouteSnapshot } fr

2017-01-04 11:42:17 3286 2

原创 angular2系统学习 - 路由与导航(4)

angular2系统学习 - 路由与导航(4)1.路由守卫路由守卫其实就是一种拦截机制，在进入离开视图等时的拦截行为。守卫返回true，则继续运行；返回false则停止导航。常用于权限控制。守卫还可以告诉路由器导航到别处。路由器支持多种守卫：用CanActivate来处理导航到某路由的情况。用CanActivateChild处理导航到子路由的情况。用CanDeacti

2017-01-04 10:05:26 2848 2

原创 angular2系统学习 - 路由与导航(2)

angular2系统学习 - 路由域导航(2)1.模块注册路由NgModule注册路由分根模块(AppModule)与子模块注册路由,只有根模块AppModule才能使用forRoot()方法。- 主模块 RouterModule.forRoot()方法- 子模块 RouterModule.forChild()方法

2017-01-01 19:21:48 2159

原创 angular2系统学习 - 路由与导航(1)基础篇

angular2系统学习 - 路由域导航(1)基础篇本篇内容主要学习路由与导航的基础知识。1.base href如果app文件夹是应用的根目录，则在index.html的head中加入<head> <base href="/"> ...<head>2.AppModule配置2.1引用路由import { RouterModule, Routes } from '@angular/

2017-01-01 14:47:00 2973 1

博客转至https://chengyanzhao.github.io，CSDN不再更新。