- 博客(84)
- 收藏
- 关注
RSS订阅原创 angular 动态生成组件如何插入html 片段（类似ng-content的功能）
1.需求：有一个alertComponent组件，需要动态生成（使用viewChild ，ViewContainerRef ，componentFactoryResolver）组件，但是需要投影一段html到alertCompoment里面去。 问题分析：如果是使用标签实例化，直接使用ng-content就可以投影对应的内容进去了，例如：<alert-Compoment>...
2018-11-08 17:59:45
5208
原创 angular 使用第三方库（利用@types实现）
应用场景，在使用angular开发的时候，需要使用到jq，moment，lodash这些js库的时候该怎么操作这是很常见的问题，我就分享一下我自己的使用情况，以moment为例1.npm install moment --save 安装momentjs2.npm install @types/moment --dev 安装moment的类型定义文件，这里主要是把moment库的方法，变量声明，并...
2018-07-04 12:07:34
1976
原创 localStorage在IE11下，两个窗口值不同步问题
问题点：localStorage的值正常情况下是同一个域下是共享的，比如你打开两个同域下的页面，不管两个页面是不是独立一个窗口，他们localStorage的值都应该是共享的，一个改变，另一个也会发生改变。例如：打开两个相同的地址A，B, 然后在A，B网页的控制台分别执行下面代码： setInterval(()=>{ localStorage.setItem("tim...
2018-04-19 17:35:39
2571
1
原创 头尾固定高度中间自适应高度
这是关于常用的css布局技巧：需求：头部和尾部高度固定，中间高度自适应ps:我这里不贴代码，只是讲技术点和思路，毕竟我这个不是教程，我只是希望用我的一点点时间写一些博客，可以给那些刚入门的前端同学一点点帮助。1.兼容低版本ie的写法head: 头部设置固定高度，例如高度100pxcontent：设置绝对定位，top：100px; bottom:100px; left:0,right:0;ove...
2018-03-28 10:47:19
1032
原创 angular2中input只允许输入数字，而且数字有千分位格式
直接奔主题，不扯淡：需求：在angular2表单中，input只允许用户输入数字，而且要把数字格式化显示，比如1000 => 1,000思考：用type=number能不能达到？ <input type="number" class="form-control" ngModel="{{config.value|number}}" (ngModelChange)="config.valu...
2018-03-14 12:27:38
6248
1
原创 angular4 环境变量配置
好久没有来了，今天风和日丽，就来分享个小知识，不扯淡，直接进入主题：需求：使用angular实现前后分离开发，必然遇到环境问题，比如：在本地开发你需要请求的地址是：www.bendi.com在内部测试的时候你需要请求的地址是：www.dev.com在给测试人员测试的地址是：www.staging.com最后再正式上给用户使用的地址是：www.prod.com问题来了，那是不
2017-11-06 10:34:01
7897
原创 angular2升级到angular4小坑 第二篇
1.之前讲过angular2升级angular4的问题，主要是node降到7以下，angular-cli版本降级到1.2.6，但是！但是！但是！依然有可能会出现问题，如果你构建项目使用--prod，可能会报一个错误，大致 意思是私有变量只能在组件里面使用，也就是说private name 这个属性只能在组件里面使用，不能再HTML中使用，这是一个小坑，解决办法就是把private定义的变
2017-09-06 09:48:06
2376
5
原创 升级angular4 环境小坑
最近使用angular2开发一个项目，由于angular更新太快了，所以在项目中期就决定从angular2升级到angular4，以下是升级中遇到的小坑1.ng build的时候加上--prod参数就报错，不加上正常，这个主要是angular-cli版本问题，不能更新到最新的版本，目前我测试到的是1.2.6这个版本是可以的2.如果angular-cli版本已经降级了，ng buil
2017-09-04 09:25:58
2050
2
原创 ionic2 打包apk 注意事项
在2016年的最后一天，再来一次分享来结束2016这碌碌无为的一年。最近的分享主题依然是angular2 ionic2 混合App这三个主题，今天就来分享一下把ionic2项目打包成app的注意事项：例牌上需求是：你已经用ionic2开发好一个应用了，在浏览器测试后，你想用android模拟器测试以及打包apk文件用真机测试。1.安装android studio，去官网下载最新版本（既然你
2016-12-31 11:38:18
6181
13
原创 ionic2--tabs笔记
ionic2的主要作用是用来导航的，今天就来撸一撸tabs的常用方法，主要分两组使用方法比较：1.在根组件中导航（意思就是tabs组件就是你这个项目第一个启动的组件，也就是app.module中，IonicModule.forRoot(MyApp),这里设置的跟组件，这个时候可能有细心的同学发现，在ng2中都是在bootStrap中设置启动组件的，这里怎么不一样，其实不管在哪里，ng2还是ng
2016-12-24 17:13:38
4418
原创 ionic2的component中使用angular2中的管道使用（特别是number管道，小坑）
原生app有一千种好，但是就是有个小缺点，成本高，刚好这个又是大多数老板和创业团队所不能承受的，所以随着手机硬件的不断进化，webApp迎来爆发期，其中ionic2个人觉得是一个不错的webApp开发框架，特别是你是ng2的爱好者，今天就来谈谈ng2中的小坑以及分享一个探索学习的方法。例牌：需求是要在ionic组件里面使用管道，例如：使用数字管道或者货币管道1.看到需求的第一反应肯定是去官
2016-12-24 10:17:49
3115
原创 angular2 在input上使用管道(过滤器）
1.例牌，上需求需求：用angular2进行开发Web App,登录时，用户填写的小写字母直接转换成大写字母显示： abc=>ABC;各位客官看到可能想打我，ng2不是有个uppercase管道吗？直接用就好了，还跑来这里讲故事，客官别急啊：{‘abc’ | uppercase} 这个样子是会显示出大写的，但是，我说的是input，难道要这样写： 显然如果这样不报错我就不来YY了
2016-12-19 18:57:58
8206
3
原创 html 中的属性(property)以及DOM对象中的attributes的详解
先来讲讲今天的主题： 探索property(也就是html的某些属性，比如input的value id这些自带属性）和attributes(html中能看到的所有属性，包括自定义属性)的差异先来讲讲本"勃主"对这两个玩意的定义：property: 指的是html 标签自带的属性，比如input 的value，id这些特有的属性，也就是说在w3c标准里面有提到的属性attributes:
2016-12-14 19:17:35
6931
3
原创 angular1 在路由中使用定时器实录
虽然ng2已经出了，而且完成了一大升级，简单易学，而且还吸收了react的功力，但是，ng1怎么也是糟糠之妻不可弃啊，最近在使用ng1路由的时候，稍不留神就给自己挖了两个坑，话不多说，咱开始讲故事了。有一天，老板叫我：老板：小毛啊，最近准备做个报表wo:哦老板：报表显示总的信息，层层点击进去可以看到详细信息，而且还要有倒计时自动刷新或者用户点击刷新，刷新数据不一样要闪个黄色。。。。
2016-12-13 17:20:03
1042
原创 浏览器的事件捕获阶段和冒泡阶段笔记
当我们在浏览器点击一下的时候，为什么就可以执行指定的代码，用户点击这下，浏览器背后发生了怎样动人的故事，接下来就来一起寻找浏览器事件背后的故事我们如果想用户点击某个节点事执行某段代码，我们可以这样做：1. //直接在html中调用方法，这个是浏览器暴露的接口之一，HTML事件处理程序（也可以叫事件侦听器），就是侦听这个dom节点的click动作，hello方法就是这个侦听器的回调函
2016-11-02 18:23:30
1753
原创 angular 实现input中view显示为货币格式，model中绑定的为纯数字
今天是1024，我是猿我光荣，受到程序猿乐于分享的精神影响，今天分享一个angular的干货作为纪念：需求：在input框中输入数值，在页面上显示的数值是格式化成货币格式的数值，比如：123456789=》123,456,789；但是绑定到ng-model中的确实123456789这样的纯数字。需求延伸，不仅仅是数字，只要是输入框要在view中显示格式和model中的显示格式不一样，这
2016-10-24 23:48:00
2288
3
转载 angular1.x select 常用技巧
一、用法ngOption针对不同类型的数据源有不同的用法，主要体现在数组和对象上。数组：label for value in array select as label for value in arraylabel group by group for value in arrayselect as label group by group for value
2016-10-21 21:44:58
1007
原创 this 指向二-----构造函数的this指向
在函数中，this没有作用域和继承的概念，this的指向主要看调用的方式，详情请看this指向一，今天主要撸一撸当new 关键字调用函数时thsi内部的指向，分两种情况：1.构造函数没有调用return语句或者调用return语句但是没有返回值或者返回一个原始值得时候当new调用方法时，会创建一个空对象并且试图初始化这个空对象，这时this的指向自然就是指向这个新创建的对象了2
2016-10-17 22:06:35
650
原创 jq select元素常用的方法
1.获取当前选中的optionvar $selectOption=$("option:selected");2.获取选中的value： var selectValue=$selectOption.val();3.获取选中的text:var selectText=$selectOption.text(); //ps：注意，有时候value和text可能是不一样的，用户看到的是text
2016-10-09 18:27:11
733
原创 css 布局小技巧 左边固定右边自适应
在页面布局或者是列表布局中，我们经常出现一个场景：左边是固定宽度的盒子，右边自适应：div class="product_open"> label class="label">Open Product:label>//这一列是固定宽度 ul class="check_game">//这一列自适应 li>label>input type="checkbox">
2016-09-13 19:15:33
4631
原创 子盒子水平垂直居中的小技巧
1.这种方法只适合在父盒子只有一个子盒子的时候使用代码如下：style> .content{ position: relative; width:300px; height:300px; margin:0 auto; background-color: orange; } .box{
2016-09-12 15:16:42
2682
原创 toString()方法和Object.prototype.toString.call()方法对比
不扯淡，直接入主题，客官看代码：var arr=[1,2];直接对一个数组调用toString()arr.toString();// "1,2"通过call指定arr数组为Object.prototype对象中的toString方法的上下文Object.prototype.toString.call(arr); //"[object Array]"错误理解：按照arr是Ob
2016-09-06 10:30:51
4938
原创 margin的折叠与计算以及解决之道
今天就来捋一捋简单低调却奢华的css,主要鲁三个点：一.margin的折叠二.margin折叠后的计算三.margin折叠的解决之道先来捋一捋margin的折叠：主要分为父子折叠以及兄弟折叠，都是垂直方向上的折叠父子折叠（不一定是父子，可以是多层级的包含，只要是空盒子嵌套）看例子：我们的目的是想让li和ul之间有个10
2016-09-01 11:24:32
3023
原创 for in的坑
很多时候为了方便都会直接用for ..in代替for循环，但是一不小心可能就被出卖了1.for..in 遍历不一定按照顺序遍历，所以可能得到的和预期的数据不匹配2.for..in可以遍历出在原型上修改的属性，比如：Array.prototype.name='test'; var aa=[1,2]; for(var i in aa) console.log(i); //1 ,2 , nam
2016-08-23 14:57:38
591
原创 angular $http post数据和jQuerypost数据不一样
最近遇到一个坑，用jquery post请求数据的时候有数据响应，但是用angularjs的post方法就没有数据响应，对比了请求头一模一样，唯一不同的就是数据的格式有点不一样：最后发现angular会对post的数据进行一个默认的转换：如果请求的数据包含js对象，angular会默认的把data序列化JSON格式，如果后台没有处理是获取不到data的。解决办法：var req
2016-07-12 18:37:41
3344
原创 js 实用技巧
1.转化为Boolean类型很多时候我们都用隐式转化成Boolean来判断，比如：0==false;undefinde==false;但是：0===false: //false所以最好先显式转化成Boolean!!0===false; //true2.为一个未知的变量赋值var aa=bb||0; 如果bb不存在就会默认aa=0；3.将a
2016-07-11 12:10:11
385
转载 js caller 和callee的区别
1.caller返回一个函数的引用，这个函数调用了当前函数；callee返回正在执行的函数本身的引用，它是arguments的一个属性；callercaller返回的是一个函数的引用，这个函数调用了当前函数function a(){b()}function b(){b.caller;//这里返回的是a函数的引用，因为a函数调用了当前函数，如果函数没有在其他函数体内被调用
2016-07-11 11:46:06
505
原创 js for循环高性能高逼格细节分析
1.for循环相信大家都用很多，还要拿出来讲，这不是侮辱人吗？客官别急，给我一首歌的时间一般用for循环的方法：for(var i=0;iconsole.log(i);console.log(arr[i]);}相信大多数人都是这样写的，但是客官请看：每次循环都读取一次arr.length你不累啊，你不累计算机还累呢每次要获取当前遍历的值的时候还要去读取一次，如果多个
2016-07-08 10:59:52
7439
5
原创 nodejs require本地模块的一些细节笔记
先看node加载模块的流程，这里盗用一张别人做好的图，这里讲的主要是非原生模块的引用细节。如果加载原生模块就没什么可注意的了，直接var 变量=require(模块名) =》var fs=require('fs'); node会按照上面的流程去加载模块如果是自己写的模块，就可以通过相对路径去引用了，比如我引用一个同级的people模块： var people=require(
2016-06-28 17:31:25
6969
原创 node批量读取文件时异步变同步的方法分享
需求，读取一个文件夹下面的文件，并且获取其中的文件夹名字：编码：var fs=require('fs');var dir=[];//定义一个数组，存放文件夹的名字fs.readdir('./',function(err,files){ //读取根目录下的所有文件，files为所有文件名字的集合for(var i=0;i var theFilename=files[i];//
2016-06-27 14:32:11
2418
原创 浅谈nodejs与php设计构思层面上的差异
nodejs最近火的一塌糊涂，那为什么它可以成为千百程序员的新宠呢？难道只是因为把js搬到了服务端？如果仅仅是这样是迁移了一个运行环境和增加几个模块的话我想完全不可能会得到喜新厌旧的程序员的青睐nodejs和php的差异主要是两个方面：分工和运行机制分工：nodejs直接跳过了服务器这个阶段，把创建服务器作为node的一个模块，监听请求这些应该是服务器做的工作现在变成了node做，这样
2016-06-27 13:06:28
3295
原创 js 柯里化函数
柯里化，听起来有点像数学名词，但是它确实和数学的数列有想象之处直观的表现：柯里化最直观的表现就是把一个需要传入多个参数的函数变成多个嵌套的只要传入一个参数的函数var add=function(x,y){ return x+y;}柯里化成这样：var addCurried=function(x){ return function(y){ return x+y;
2016-06-23 16:16:20
2083
原创 js的两种查询方式 LHS and RHS
在js引擎中存在两种不同的查询方式：LHS（Left-hand Side）:left是指“=”号的左边，意思是要给查询得到的这个变量赋值，比如要吧1付给a变量，要先查询a是否存在，这时候用的就是LHS查询RHS（Right-hand Side）:right指的是“=”号右边，意思是要获取某个变量的值，比如打印a变量，console.log(a);js引擎要去查询这个变量是否存在，得到变量只
2016-06-22 18:16:25
4493
3
原创 fis3在asp.net项目中的使用记录
fis3是比较流行的一个自动打包工具，在纯静态的页面中相信只要看过文档的小伙伴都能自如的应用，但是如果公司使用的是asp.net开发，使用起来就不太方便了，因为mvc使用了一些目录结构的限制，还有进行页面布局的控制。1.找一个合适的目录存放你的静态资源以及.cshtml页面，通过编译发布到asp.net指定的目录，比如项目img，css ,css都是放在content文件夹下的，而页面放在视图
2016-06-22 12:00:24
1351
4
翻译 js typeof和instanceof的区别
typeof是一个一元运算，放在一个运算数前面，运算数可以是任意类型的数返回值一般有这几个：number，boolean,string,function,object,undefined实际应用中通常用来获取一个变量是否存在，if(typeof a!='undefined'){alert('ok')}; 不要用if(a){}这样的方式判断是否存在，如果不存在会报错，而且有bug，如果a是0
2016-05-28 16:44:36
436
原创 json和js字面量对象对比以及json序列号和反序列化的技术细节
json是一种数据格式，和js的字面量对象很像，但是还是有一点差别的1.json对象顶级外层一般是对象或者数组，也可以是字符串，等基本类型变量，但是不可以是undefined，键值对的值也不可以是undefined2.json对象是键值对的键必须要有双引号，不可以是单引号更不可以么有引号，而在js对象中可以，而且在json结尾不能有分号，而js对象有在js中提供了一个JSON对象来实现
2016-05-23 12:02:10
1697
原创 js 闭包
js的闭包是一个前端工程师学习路上必须理解的一个东西，要理解闭包就必须理解变量作用域和生存周期作用域，就是指变量的有效范围，比如函数的局部变量的有效范围就是函数内部，全局变量在全局作用域有效生存周期：全局变量的生存周期是永久性的，除非我们主动销毁，但是普通的函数局部变量就不一样了，函数执行完毕就会销毁，确切的说当一个变量没有被引用的时候就会触发回收机制，具体可以去看看js的自动回收机制，这
2016-05-22 22:13:57
282
翻译 js this的指向详解
js 的this指向主要有四种：1.作为对象的方法调用，这个时候this指向的事该对象例如: var obj={a:1,getA:function(){alert(this===obj);//truealert(this.a);//1}}2.作为普通函数调用，这个时候this总是指向全局对象（在浏览器中既window对象)window.name='z
2016-05-21 14:42:02
5609
原创 js try{}catch(err){} 异常处理
今天就来扯扯js的异常处理try{}catch(err){},虽然js的异常处理没有php这些后端语言的异常处理完善，但是还是能模拟出类似的部分功能的：快速入门案例：try{//要执行的代码}catch(err){//获取异常，err是抛出异常throw 传递的参数，可以是对象或者是字符串等等基本数据类型}demo:function filter
2016-05-18 16:59:43
5137
原创 js数组合并concat()和Array.prototype.push.apply()的性能分析
js数组合并有两个常用方法，用法如下：var a=[1,2,3],b=[4,5,6];1.a.concat(b);//得到1,2,3,4,5,6；1.1那个数组在前面合并后那个数组的元素就在前面1.2 可以利用这个来复制一份数组，a.concat(a);1.3 数组长度无限制，返回值是合并后的数组1.4 千万级别的数组合并大约30毫秒2.Array.protot
2016-05-17 09:54:21
22798
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人