- 博客(52)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 Angular--服务
使用服务可以轻松的实现跨组件跨模块共享数据@Injectable({ providedIn:'root' // 服务的作用域在“根”，任何一个模块一个组件都使用同一个服务实例对象 // providedIn:ModuleName // 模块级别注册服务，该模块下的所有组件使用同一个服务实例对象})@NgModule({ // 模块级别注册服务，该模块下的所有组件使用同一个服务实例对象 providers:[ServiceName],})@Component({ //
2021-10-02 22:57:59
215
原创 依赖注入DI
面向对象的一种设计原则，用来减少代码之间的耦合度，增加了代码的可维护性。在A类的外部实例化B类，在实例化A类的时候，将它的依赖项通过contructor构造函数参数的形式注入到类的内部。这样在修改B类的时候，不需要修改A类。Angular框架帮助我们实例化依赖类。DI的四个核心概念：1）、Dependency:组件要依赖的实例对象（服务实例对象）2）、Token:获取服务实例对象的标识3）、Injector:注入器，负责创建维护服务类的实例对象并向组件中注入服务实例对象。...
2021-10-02 22:38:32
134
原创 Angular生命周期
一、初始化阶段1、constructorAngular在实例化组件类时执行，可以用来接收Angular注入的服务实例对象；可以获取到引入的实例，还获取不到接收的属性值2、ngOnInit在首次接收到输入属性值后执行，在此处可以执行请求操作在此可以打印接收到的属性值3、ngAfterContentInit在内容投影渲染后调用(@ContentChild("ContentName") content:ElementRef<类型>)4、ngAfterViewIn
2021-10-02 22:37:26
522
原创 异步是如何实现的？
Javascript是单线程语言，实现异步操作是在事件循环中进行的#mermaid-svg-cqh2uFQOlxP4VzuH .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-cqh2uFQOlxP4VzuH .label text{fill:#333}#mermaid-svg-cqh2uFQOlxP4VzuH
2021-09-26 15:41:25
238
原创 js是一门什么样的语言
1、脚本语言，不需要编译，可以由解释器直接运行2、弱类型语言，声明时不需要明确变量的类型，赋值给它什么类型，它就是什么类型3、面向对象。将事物当做一个对象来看待，对象中有属性和方法，使用对象的时候不需要考虑具体的实现过程，只需要调用其中的方法即可...
2021-09-26 15:02:51
198
原创 React componentWillReceiveProps()在props不改变的情况下被调用
componentWillReceiveProps在初始化渲染阶段并不会被调用。props发生变化的时候会调用componentWillReceiveProps，但是这并不意味着props的值发生了变化。componentWillReceiveProps在props发生变化的时候被调用。为了避免深层比较（代价昂贵），react在父组件渲染的时候，就检测为props改变了，故而调用子组件的componentWillReceiveProps方法。因此，componentWillReceiveProp
2021-09-25 18:43:58
581
原创 Angular的依赖注入
3、react为什么使用单向数据流4、react的生命周期5、componentWillReceiveProps6、setState()依赖注入（DI）是一种重要的应用设计模式。依赖，当类需要执行其功能时，所需要的服务或对象。DI是一种编码模式，其中的类会从外部源中请求获取依赖，而不需要我们自己创建它们Angular系统中通过类上添加@Injectable装饰器来告诉系统这个类（服务）是可注入的。...
2021-09-24 19:45:39
513
原创 为什么使用Angular
1、强大的前端开源框架 包含了组件化方案、模块化方案、测试方案、表单验证、路由、国际化方案和安全方案等，vue(渐进式)和react需要自己进行组装，例如【Angular = Vue + vue-router + axios + kama + 表单验证插件 + i18n...】定制的自由也可能会带来不断重构架构的噩梦，另外，我们公司不能访问外网，不能随意的下载依赖，针对这一点，angular是一个很不错的选择2、成熟的文档：Angular更强势更主观，它的文档对于如何完成某个功能给...
2021-09-24 17:43:31
122
原创 Ember controller之间通信
Ember controller之间通信使用Ember做项目有一段时间了，查看项目之前的代码，当一个controller用到另一个controller的数据时，总是使用将变量存到localStorage中的方法，虽然这种方式是可以实现功能的，但是有很多局限性：1、无法直接监听localstorage的变化2、localStorage本质上是对字符串的读取，如果存储内容多的话会消耗内存空间，导致页面变卡3、在浏览器隐私模式下，不能读取localStorage4、localStorage不能被爬虫抓取
2021-04-11 15:46:34
117
原创 Ember调用资源container.lookup
Ember调用资源例如：this.container.lookup(`route:${routeName}`);this.container.lookup(`view:${viewName}`);this.container.lookup(`controller:${controllerName}`);this.container.lookup(`adapter:${adapterName}`);
2021-04-11 15:25:31
91
原创 阻止action冒泡
应用场景封装了table组件后，在tr上有点击事件，在td上传入点击事件时会冒泡到tr上，触发tr的点击事件。这时使用`bubbles=false`可以阻止td上的点击事件冒泡。使用使点击‘按钮’的时候只执行click2不执行click1<tr {{action 'click1'}}> <td {{action 'click2' bubbles=false}}>按钮</td>{{/tr}}...
2021-03-16 16:39:15
145
原创 input光标的移动和选中
方法一input.setSelectionRange(opsStart,opsEnd);setSelectionRange方法用于设定<input> 或 <textarea> 元素中当前选中文本的起始和结束位置。当opsStart和opsEnd相同时，可用于定位光标位置。setSelectionRange实际上是改变了selectionStart 和 selectionEnd属性，所以也可以通过直接修改这两个属性来实现方法二input.selectionSt
2020-12-03 17:13:51
2820
原创 数组字符串常用操作总结（一）
1、数组合并--concat()将两个数组合并成一个新的数据，不影响原来数组的值let arrA = [1,2,3];let arrB = [4,5,6];let arrC = arrA.concat(arrB); // arrC [1,2,3,4,5,6]2、数组过滤--filter()筛选出的数据生成一个新的数组，不影响原来数组的值let arrFilter = arrC.filter(item=>{ return item > 4});//
2020-11-30 19:07:43
142
原创 正则拼接字符串
// 直接写正则；let reg_1 = /aabc/;// 拼接字符串let text = 'aa';let reg_2 = RegExp(text + 'bc'); let reg_3 = RegExp(text + 'bc','gi'); console.log(reg_2); // /aabc/console.log(reg_3); // /aabc/gi
2020-11-30 17:41:35
2549
原创 jsPDF in Emberjs: 导出界面为pdf
在Ember项目中，引入jspdf实现前端界面导出成pdf界面，出现以下问题：Uncaught Error: an unsupported module was defined, expected `define(name, deps, module)` instead got: `1` arguments to define`搜索解决办法如下： if (typeof module === 'object') { module.exports = callback(); } else i
2020-10-16 11:09:08
118
原创 Ember项目引入js依赖
1、每个ember-cli managing dependencies，第三方库，jQuery插件等通过bower安装2、bower install --save http://example.com/js/myjsfile.js以jsPDF和html2canvas为例：# 下载安装bower install --save https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.jsbower install --save
2020-10-16 11:07:58
190
原创 slideDown和slideUp初始状态设置，使用animate替代
使用jquery的slideDown展开效果时，需要使用slideUp效果关闭，才能使用slideDown效果展示，在处理初始状态时，需要先执行收起操作，会出现界面闪动的问题，造成界面不干净。slideDown和slideUP的实质是{display:show}和{display:none}如果使用{display:none}设置初始状态，slideDown的效果并不能展示所以，经研究使用了animate方法来代替slideDown和slideUP方法// jS文件function s
2020-09-23 11:09:17
904
原创 火狐浏览器title显示不全
title = 'http://111.111.111.111/index/aaaaaaaaaabbbbbbbbbbccccccccccddddddddddeeeeeeeeeeffffffffffgggggggggghhhhhhhhhh'火狐浏览器中的title遇到长单词不会自动换行，导致title显示不全。解决思路：由于遇到空格会自动换行，所以，先将字符串按空格划分，然后判断每一部分的长度，（经实验发现一般长度超出68~70就会出现显示不全的问题），如果长度超过68，则添加一个空格，这样...
2020-09-22 18:20:15
969
原创 常用JS dom操作
1、元素1、创建元素let para = document.createElement("p"); // 创建新元素<p>let node = document.createTextNode("这是一个新的文本节点"); // 创建一个新的文本节点para.appendChild(node); // 将文本节点添加为p元素的子节点2、添加元素parent.insertBefore(child1, child0); // 在parent节点的子节点child1节点之前添加child
2020-05-19 20:10:54
148
原创 网页变灰
今年国家哀悼日，几乎所有的网站都变灰了，哀悼失去的人们。实现的代码如下：.css { -webkit-filter: grayscale(100%); /* chrome */ filter: grayscale(100%); /* firefox */}...
2020-04-29 18:29:14
172
原创 div--可滚动但不显示滚动条
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>可滚动但...
2020-04-29 17:59:58
1460
原创 合并数组并去重
let a = [1, 2, 3, 4];let b = [2, 4];let c = new Set([...b, ...a]); // Set对象的特性，成员的值是唯一的，从而达到去重的目的let s = Array.from(c); // Array.from() 把Set对象在转化为数组console.log('d',d); // [ 2, 4, 1, 3 ]...
2020-04-15 18:41:35
721
原创 localStorage和sessionStorage
localStorage用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除 sessionStorage用于临时保存统一窗口（或标签页）的数据，在关闭窗口或标签之后将会删除这些数据属性（方法） 描述 length 返回存储对象中包含多少条数据 key(n) 返回存储对象中第n个键的名称 getItem(keyname) 返回指定键的值 se...
2020-03-10 16:45:07
94
原创 Cookie
学习cookie首先要明白，cookie是为什么而产生的。1、什么是cookie?cookie 实质上是存储在计算机硬盘上某个目录下的文本文件。2、cookie的常见应用1）、网站记住用户名、密码的功能、自动登录的功能等等2）、网站的一键换肤功能，记录相关信息，在刷新界面时仍然保留当前皮肤3）、网站不同用户登录的权限不同，保存权限信息3、cookie的特点1）、存储...
2020-03-10 16:15:48
187
原创 HTML学习（一）
<!DOCTYPE>声明作用：明确声明html版本，有助于浏览器正确显示网页特性：1、不区分大小写2、没有结束标签3、位于文档中最前面的位置，处于标签之前通用声明** HTML5 **<!DOCTYPE html>** HTML 4.01**<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transiti...
2020-02-22 16:27:41
75
原创 网页刷新方式
1、reload重新加载当前文档（刷新当前界面）document.location.reload([bForceGet]);bForceGet，可选参数，默认false,从客户端缓存中获取当前页；true,以GET方式，从服务端取最新的页面，相当于F5刷新2、replacedocument.location.replace(url);...
2020-02-20 17:22:19
448
原创 数组添加移除某个元素
let arr = [1, 2, 3, 4, 5, 6, 7];// 移除3let itemIndex = arr.findIndex(item => { return item === 3;});arr.splice(itemIndex, 1);console.log('arr', arr); // [ 1, 2, 4, 5, 6, 7 ]// 添加元素...
2019-12-30 10:52:14
298
原创 base64转码后的字符串应用于url
问题：base64转化后的字符串中会含有‘+’、‘/’、‘=’这些字符，当把该字符串应用于url中时，会影响url的解析解决：将‘+’、‘/’、‘=’转化为base64转化不会生成且不影响url解析的的字符，如‘*’、‘_’、‘-’、‘.’// Base64实现var Base64 = { _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdef...
2019-12-24 10:13:52
636
原创 对象变成了[object Object]
如果你的对象变成了[objectObject]，说明他被强制类型转换为了字符串。let a = {};console.log(a+''); // [object Object]console.log(typeof (a+'')); // string可是有的方法，确实只接受字符串参数，所以要将对象转化为对象字符串，进行传递console.log(JSON.stringify(...
2019-12-23 14:49:08
4990
1
原创 文件上传时：NET:ERR_CONNECTION_RESET
"NET:ERR_CONNECTION_RESET" （错误链接重置）浏览器中上传文件时，报以上错误。原因是：文件大小被限制，导致文件上传失败
2019-09-10 17:03:32
6136
原创 linux系统大小写敏感
url="/form/formdef/formDefPreview.html?key=RecordListManagement&id={{data.RecordListManagement.id}}&isClose=true"同样的url在本地部署的程序上是可以运行的，但是在线上部署却显示`404-找不到`而下面的这个网址在线上线下都可以访问：...
2019-09-09 11:11:15
4122
原创 js和jQuery获取点击按钮的属性
<html><head> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> function getByJs(that) { ...
2019-09-03 15:35:31
2921
原创 实现angular页面的更新
$scope(上下文模型)视图和控制器之间的桥梁用于在视图和控制器之间传递数据利用$scope暴露数据模型（数据，行为）$watch(监听函数)$watch(watchModel,watchFunc,watchDeep)// watchModel--被监听的数据// watchFunc(newValue,oldValue,scope) 数据发生变化时的回调函数// watchD...
2019-08-28 15:42:10
634
原创 oh-my-zsh insecure directories
每次打开 ubuntu 时报错：zsh compinit: insecure directories, run compaudit for list.Ignore insecure directories and continue [y] or abort compinit [n]?compaudit 找到不安全的文件夹或者文件查看不安全的文件或文件夹：> c...
2019-08-22 20:22:54
429
原创 jQuery
1、jquery 选择器含义$(“p”)选取<p>元素$(“p.info”)选取 class="info"的<p>元素$(“p#info”)选取 id="info"的<p>元素$("[href]")选取带有 href 属性的元素$("[href=’#’]")选取 href=’#'的元素$("[...
2019-08-20 20:46:32
83
原创 JS自定义排序
自定义排序var arr = ["梨","苹果","香蕉"];console.log("arr排序前：",arr); // [ '梨', '苹果', '香蕉' ]var customSort = new Map([["苹果",1],["梨",2],["香蕉",3],[undefined,4]]);arr.sort(function(a,b){ if(customSort.get(a)&...
2019-08-20 14:34:12
1174
原创 white-space、word-break、word-wrap
white-space – 控制空白字符的展示属性值换行符空格自动换行备注nomal×合并√默认nowrap×合并×不换行pre√√√preserve 保留空格和换行pre-wrap√√√preserve+wrappre-line√合并√preserve+new line+wrapword-break...
2019-08-19 17:29:18
116
原创 对象（包括数组对象）的复制和赋值
// 对象的赋值（浅拷贝--指向同一个地址）var obj1 = {a:1,b:2};var obj2 = obj1;obj2.a = 3;console.log("obj1:",obj1); //{ a: 3, b: 2 }console.log("obj2:",obj2); //{ a: 3, b: 2 }// 解构赋值（浅拷贝）let [obj4] = [obj1...
2019-08-14 21:00:55
341
原创 对象的两种取值方式——点方式和[ ]方式
// 对象取值————点方法和[]方法var obj = {a:{a1:"a2"},b:"b1",0:"00"};var key = 'a';var key2 = "a.a1";console.log(// 一级取值: //键名是字符串 obj.a, // { a1: 'a2' } obj['a'], // { a1: 'a2' } obj.b...
2019-08-06 09:37:06
2679
input光标操作.html|input光标操作.html
2020-12-03
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人