自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

erciyuan_nuonuo的博客

二次元·诺诺

原创 angular ionic 实现elm

https://github.com/nuonuoge/ionic3_angular5_elm 欢迎star 效果如图:

2018-06-04 22:17:56

阅读数 118

评论数 0

原创 angular自定义验证器

https://www.jianshu.com/p/6221e4eee4a5

2018-01-31 19:57:42

阅读数 2002

评论数 0

原创 angular中的ng-content

http://www.jianshu.com/p/e2c37c24e871 (转战简书)

2017-11-28 21:32:27

阅读数 943

评论数 0

原创 angular中的ng-template

http://www.jianshu.com/p/f0abac50c6b6

2017-11-08 20:42:30

阅读数 968

评论数 0

原创 angular jit and aot

为什么需要编译Angular应用中包含的组件、HTML模板(比如:@Directive、@Component、@NgModule、@Pipe)很多都是JS VM无法解析的,所以在浏览器渲染应用之前,组件和模板必须要被Angular编译器转换为可以执行的JavaScript。angular2编译模式...

2017-07-04 21:58:57

阅读数 497

评论数 0

原创 angular2 路由策略 LocationStrategy

随着前端技术的发展和迭代,前端MVC框架应运而生。利用目前主流的前端框架,如angular react vue等等,我们可以轻松的构建起一个无需服务器端渲染就可以展示的网站,同时这类框架都提供了前端路由功能,后台可以不再控制路由的跳转,将原本属于前端的业务逻辑全部丢给前端。什么是路由简单举例说明...

2017-05-29 12:44:21

阅读数 4032

评论数 0

原创 css input[type=file] 样式美化 (radio checkbox类似)

在做input文本上传时,由于html原生的上传按钮比较丑,需要对其进行美化主要想到以下几种方法,欢迎大家补充1. 通过position和opacity实现 input的透明度设置为0,设置为绝对定位,size足够大 input外面套一层a或者div(此处以a举例),a设置为相对定位,为了避免在非...

2017-05-24 21:05:00

阅读数 572

评论数 0

原创 slider 滑动条 mouseup有时失效的原因

一些滚动条是通过mousemove和mouseup实现的 鼠标按下时通过mousemove事件控制滑动 鼠标弹起时通过mouseup事件取消滑动但是发现有时鼠标弹起时并没有出发mouseup事件,这是因为此时drag事件屏蔽了mouseup事件,可以通过 ondragstart="ret...

2017-05-16 21:43:16

阅读数 676

评论数 0

原创 flex 最后一行左对齐

最近项目布局上要求item两端对齐,而且最后一行在列不满的情况下要求左对齐,使用flex的justify-content: space-between;实现时发现最后一行不能左对齐,而是两端对齐方式,下图不是项目上想要的效果(不使用flex也可以实现,本文仅讨论使用flex实现)在网上查了很多资料...

2017-05-12 21:18:51

阅读数 16172

评论数 4

原创 css表格中设置两行中间的空白间距

css设置两行中间的空白间距: border-spacing 属性设置相邻单元格的边框间的距离(仅用于“边框分离”模式)。border-collapse: separate; border-spacing: 0px 10px;

2017-05-10 21:23:15

阅读数 7376

评论数 0

原创 vscode安装教程(windows)

进入vscode官网(https://code.visualstudio.com/Download),点击zip下载 2.下载后解压zip包,打开code.exe即可 3.vscode相关插件可以从 https://marketplace.visualstudio.com/VSCode下载

2017-05-03 21:15:32

阅读数 44786

评论数 0

原创 图片转web字体库,如何制作web字体库

最近项目上用到了很多svg图,设计师经常频繁改版,苦不堪言,于是就想到了把图片转成字体库来使用。使用图片的缺点: 1. 图片加载速度慢 2. 图片大小固定,无法调节 3. 当代码重构或者图片目录位置改变时,需要一个个修改,繁琐而且容易出错 字体库优点 1. 字体不会因缩放而失真(这根制作...

2017-03-26 20:35:23

阅读数 4726

评论数 0

原创 angular2 HostListener

interface HostListener { eventName : string // html dom 事件 args : string[] // 传入参数,可以是event对象等 } api介绍: https://angular.cn/docs/ts/latest/api/...

2017-03-15 21:49:13

阅读数 5360

评论数 1

原创 angular2 标签中attribute和property

property:dom元素作为对象附加的内容,例如childNodes、firstChild等 attribute:HTML标签特性是dom节点自带的属性异同: 1 . 部分属性既属于property,又属于attribute,比如id 2 . attribute初始化后不会再改变;pro...

2017-03-09 21:41:48

阅读数 2947

评论数 0

原创 Angular2 router.navigate刷新页面问题

造成这个问题一般是因为我们在<form>表单中使用<button>时忘记添加type属性,在表单中,如果忘记给按钮添加属性,会默认为submit<button (click)="toDetail()">detail</button>...

2017-02-15 22:06:29

阅读数 8315

评论数 1

原创 html base

base是html5的标签,它的href 属性规定页面中所有相对链接的基准 URL,target属性定义整个文件中的所有跳转的属性,包括<a> <img> <link> <form>等等href设置,此处拿标签a举例,<a>中href设置...

2017-02-08 20:20:01

阅读数 383

评论数 0

原创 angular2 router中的路由跳转navigate

navigate是Router类的一个方法,主要用来跳转路由。 函数定义:navigate(commands: any[], extras?: NavigationExtras) : Promise`<boolean>`interface **NavigationExtras** {...

2017-01-18 20:20:01

阅读数 28397

评论数 4

原创 node-sass 安装失败,提示要求安装.net SDK解决办法

windows上玩node_modules还是比较痛苦的,开发环境使用win7,node,npm,python等所需已安装好 首先设置自己的npm代理,建议设置成淘宝源,vpn国外代理当然更好 npm config set registry https://registry.npm.taobao....

2017-01-09 22:33:00

阅读数 1172

评论数 0

原创 HTTP中的GET和POST何时使用

GET:获取资源 GET方法用来请求访问已被URI识别的资源,指定的资源经服务器端解析后返回响应内容。POST:传输实体主体 POST方法用来传输实体的主体。虽然用GET方法也可以传输实体的主体,但一般不用GET方法传输,而是用POST方法。POST和GET很相似,但是POST的主要目...

2017-01-09 21:46:34

阅读数 1271

评论数 0

原创 querySelectorAll 和 getElementByTagName()等方法的区别

二者详细的使用方法不再做介绍,可以在w3c查阅二者返回的都是NodeList对象,querySelectorAll不是实时的,而getElementByTagName是实时的。实时: 假设在一个没有<div>的文档中调用getElementByTagName('div�...

2017-01-03 22:02:39

阅读数 1574

评论数 0

原创 js中的caller和callee

caller返回一个对函数的引用,该函数调用了当前函数。 functionName.caller functionName 对象是所执行函数的名称。 注意:甚用caller,这个属性是非标准的,支不支持全看各大浏览器的心情callee1.在严格模式下无法使用callee 2.返回正被执行的...

2017-01-02 10:43:27

阅读数 208

评论数 0

原创 js判断对象属性是否存在的三种方法

1.in 可以检测自有属性和继承属性var o={x:1} 'x' in o //返回true 'y'in o //返回false 'toString' in o //返回true,因为对象o继承了原型的toString属性2.haso...

2016-12-29 21:52:51

阅读数 3412

评论数 2

转载 MVC 和MVVM

1.MVC:M:model 模型数据 V:view 用户界面 C:controller 业务逻辑,控制器他们之间的关系如下: view -> controller        view传递消息到controller controller -> model ...

2016-12-28 20:56:17

阅读数 269

评论数 0

原创 css元素隐藏display:none和visibility:hidden

display: none DOM中存在display: none的元素,但是浏览器不显示 不占据空间,无法点击,动态改变此属性会引起回流与重绘 不会被子类继承,但是所有的子类都不会显示的,子类的任何手段都无效 visibility: hidden 占据空间,无法点击 只引起重绘 子类可以通过v...

2016-12-25 21:16:33

阅读数 356

评论数 0

原创 css 水平居中 margin:0 auto

在css中有很多种水平居中方法: position 定位 text-align:center margin:0 auto 使用margin:0 auto 必须设置宽度,如果不设置则默认和父元素宽度一致,不会有居中效果

2016-12-21 21:34:46

阅读数 464

评论数 0

原创 angular2:Expression has changed after it was checked

在angular2中,这个错误只会在dev开发模式下出现,在pro发布版本中不会出现,通过enableProdMode()可以控制 在组件中增加这段代码可以去掉这个检查,但是不建议这么做。import {enableProdMode} from '@angular/core'...

2016-12-19 22:18:23

阅读数 7687

评论数 2

原创 CSS选择器 first-child 、first-of-type 和 nth-of-type()

块内区域首个元素的css样式可以通过first-child、first-of-type 和 nth-of-type()实现。对于 IE8 及更早版本的浏览器中,必须声明 <!DOCTYPE>。 first-child:选择器用于选取属于其父元素的首个子元素的指定选择器 first-of...

2016-12-11 21:43:26

阅读数 1711

评论数 0

原创 HTML 文本超出宽度后实现自动截取

截断方式可以通过js逻辑实现,也可以通过CSS样式实现,使用js逻辑实现难免会使代码变的复杂,而且不容易复用,推荐使用CSS实现文本截断,而且可以在不同的HTML片段中使用。 CSS截断显示内容主要通过white-space,overflow,text-overflow三个属性实现。HTML:&...

2016-12-09 20:56:53

阅读数 6404

评论数 0

原创 HTML5 实现angular2可编辑的下拉框

HTML5中新增了<datalist>标签,它可以为 <input> 指定预定义选项列表,在使用时<input> 元素的 list 属性必须引用 <datalist> 元素的 id 属性才能生效。<datalist>是HTML5的属性,所...

2016-12-07 22:23:26

阅读数 1048

评论数 0

原创 HTML 锚点

英文定义为:“anchor”,所以翻译为“锚点”,“锚”可以理解成船上的锚,船把锚沉在水底泥土里, 船在水上漂移后,一拉锚的锁链就会回到抛锚的位置。(借用知乎网友描述)锚点的标记可以通过id和name来创建,并未仅限于标签a 链接到锚点标记位置有两种方法: 一种是利用超链接标签<a>...

2016-12-07 22:02:17

阅读数 483

评论数 0

原创 HTML中的空元素

没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的,<br> <hr>都是没有关闭标签的空元素。目前HTML支持不带关闭的空元素,但在 XHTML、XML 以及未来版本的 HTML中,所有元素都必须被关闭。 在开始标签中添加斜杠,比如 “<br /&...

2016-12-04 20:47:48

阅读数 548

评论数 0

原创 Angular2 表单form

angular2的表单主要用到了ngForm,ngModel,ngSubmitngSubmit对应的函数是我们提交表单调用的函数angular2通过ngForm将按钮的禁用/启用状态和表单的有效性关联起来#loginForm、#username和#userpwd都是angular2中的模板引用变量...

2016-11-29 22:43:53

阅读数 3585

评论数 2

原创 Angular2 可编辑的(editable)select

最近项目非常急,需要用到可编辑的select,jquery应该有很多插件,但是boss要求尽量不要在ng2中直接使用jquery,不要直接使用jquery操作dom。其实github上已经有ng2可用的库primeng对于一个初入前端的我来说短时间内研究明白primeng有点困难,于是我就取巧用了...

2016-11-25 19:32:07

阅读数 1656

评论数 0

原创 Angular2 管道pipe,如何自定义管道

作为一名前端er,我们的数据要推入到视图中,但是HTML视图中显示的格式和数据未必完成相同,比如我们的数据都是小写,但是视图中需要显示大写,如果我们在代码中另存一组转换为大写的数据,不但会使代码变得复杂难以维护,而且可阅读性差,ng2中的管道完美的解决了这个问题。ng2内置了很多管道,比如Date...

2016-11-20 15:18:44

阅读数 6410

评论数 3

原创 Angular2 单选框用法

html中单选框用法如下,checked用来选中默认的单选项:<input type="radio" name="sex" value="male" checked>Male <input type="radi...

2016-11-13 15:07:47

阅读数 5450

评论数 0

原创 Angular2 select用法-设置默认值和事件

angular2支持双向绑定,在使用select下拉框主要通过ngModel和ngModelChange实现选择事件比如现在有三个学生小明,小红,小黑,对双向绑定的student设置你想要的select值就可以在下拉框默认选中let students:string[]=['xiaomin...

2016-11-09 22:06:55

阅读数 25286

评论数 8

原创 Angular2 小白笔记

Angular2 小白笔记首先介绍下本人背景,一个刚毕业没多久的前端小白,入职后一直负责C项目的维护,没有写过JS代码,也不懂DOM层那些深奥的内容,读研期间曾经搞过一段时间C#,今年开始接触前端,看到TYPESCRIPT的时候感觉特别亲切,没有对TS和C#进行过详细的比较,感觉两门语言很像(据说...

2016-10-29 19:21:10

阅读数 413

评论数 0

提示
确定要删除当前文章?
取消 删除