- 博客(22)
- 收藏
- 关注
RSS订阅原创 mat-menu超出屏幕产生空白的问题解决方案。
问题：触发menu的元素在屏幕最右侧，但是会产生留白，无法占满屏幕。问题代码：<div class="nav-menu-op"> <mat-icon [matMenuTriggerFor]="beforeMenu">line_weight_icon</mat-icon> <mat-menu #beforeMenu="matMenu...
2020-03-18 15:25:40
414
原创 使用RxJS管理异步函数的执行顺序
场景：如果有两个异步请求A和B，B要在A请求得到唯一id之后再触发，并使用id作为api的参数，那么就很需要管理异步请求的发生顺序了，即先A再B。解决方案： RxJS中的operators里有map，switchMap可以很好的管理异步请求的结果。map可以处理Observable的结果，switchMap可以将异步A跳转到异步B的订阅。放一段Angular中routing module里的re...
2019-12-17 10:16:26
2818
原创 React-Redux中的Connect函数, Store, Action, Reducer个人小结
store:总的一个状态树，基于reducer的数量组成（每个reducer理想情况下代表一个关联到store，需要监听state变化的组件），getState() API产生的状态类似于：{ component1: { state1: 'I am state 1', state2: [], state3: false }, com...
2019-10-21 16:29:55
802
原创 AngularMaterial的Mat-Card自带最小宽度
Mat-card有一个最小宽度，在做pc web应用移动端的css调试时遇到了这个坑。因为单元组件是一个一个的mat-card，内容是在mat-card里的一个个div，所以当我在布局行和列的时候，如果一行要设置四个到六个，mat-card最小宽度会导致无法设置单元组件的宽度。解决办法就是在单元组件的css中设置：mat-card{ width:auto;}然后单元组件的宽度在父...
2019-09-30 23:38:55
825
原创 在Angular中引入Angular Material Icon的正确步骤
背景：Angular7, Angular Material7步骤：先注册 MatIconModuleimport { MatIconModule } from '@angular/material/icon';@NgModule({ imports: [ .... MatIconModule ], exports: [ MatIconModule ...
2019-09-20 10:07:32
2410
转载 chrome浏览器最小字号问题
问题原因chrome为了提升用户体验，根据电脑分辨率等条件给浏览器设置了默认的最小字号min px，小于这个字号的字体将仍然使用min px显示查看最小字体浏览器–>设置(settings)–>高级设置(advanced)–>显示(Appearence)–>Customise fonts–>Minimum font size...
2019-09-20 09:47:10
530
原创 chrome不使用缓存硬性加载（刷新）网页的快捷方法
方法一：CTRL+H 清除缓存再刷新。方法二：F12打开控制台，右键刷新键，硬性重新加载。（快捷键 CTRL+SHIFT+R)
2019-09-11 09:08:14
1318
原创 svg里的text不能自动换行的解决办法
svg里的text不能自动换行，使用\n等方法都无效。可以使用两个方法去实现多行文本。方法一： 添加多个text，给这两个text赋一样的class，每个text设置不同的x，y坐标const svg = d3.select("#oee-chart") .append("svg") .attr("width", width) .attr("height",...
2019-09-10 13:26:14
4583
原创 js把秒转化成不同格式的时间
输入参数为秒。方法1 结果 “1d23h18m15s”function transform(secs){ if(secs){ var second = parseFloat((secs % 60).toFixed(1)); var minute = Math.floor(secs/ 60) % 60; var hour = Math.floor(secs / 3600...
2019-09-10 11:13:52
256
原创 Angular Material Mat Table的dataSource变化时不会自动刷新
Mat Table的dataSource 改变时，mat-table 不会自动更新，但是mat expansion panel 可以自动侦测数据源变化。解决办法是，可以给table一个#名字 用ViewChild()获取这个table 然后手动 table.renderRows() 方法来刷新table。<table mat-table #table [dataSource]="data...
2019-08-17 21:24:45
2481
原创 js/ts中使用return跳出含有forEach循环的function函数
forEach本身是个高阶函数，调用回调函数，所以在forEach内部的return只会先跳出forEach，不会直接跳出forEach外部的函数。ts:saveNode(){ if(this.checkInputError(this.modbusDeviceInfo) && this.checkInputError(this.deviceNodeInfo)){ ...
2019-08-08 11:16:08
6803
原创 Angular获取formGroup里嵌套的formGroup
使用get方法和as类型判断ts:this.myForm = this.formBuilder.group({Address: [null, Validators.required],Neighbour: this.formBuilder.group({ Name:[null, Validators.required], Flat:[null, Validators.re...
2019-08-06 22:06:49
1605
原创 JS中string转为number方法
parseInt, parseFloat最喜欢用的Number(string);例如： Number(‘1000.1’) => 1001.1
2019-07-25 22:32:26
55623
原创 TS实例化对象并不会实例化对象内部的数组属性
写TS的时候，经常创建数组变量，并且声明了类型就直接去使用。比如在一个Object里的一个属性是一个数组ts: export class Car{ tires: string[], length: number, height: number}let car = new Car();car.tires.push('frontTire'); // 会报错，因为car.ti...
2019-07-25 22:19:36
3307
原创 JS中null与undefined个人总结
先引用一下阮老师的话：null表示"没有对象"，即该处不应该有值。典型用法是：（1） 作为函数的参数，表示该函数的参数不是对象。（2） 作为对象原型链的终点。undefined表示"缺少值"，就是此处应该有一个值，但是还没有定义。典型用法是：（1）变量被声明了，但没有赋值时，就等于undefined。（2) 调用函数时，应该提供的参数没有提供，该参数等于undefined。（3...
2019-07-25 22:10:34
187
原创 Angular中input使用ngModel双向绑定一个对象时出现cannot bind property of undefined
Background:项目中要给公司设计一个页面专门配置机器，其中有很多text input需要手动输入，最后将这些input的value组成一个json传到后端。因为在这个json中有很多嵌套的object和array，是一个复杂的json object。（因为跟底层嵌入式开发有点关系）给个部分json吧。Basic on: Angular7{ "isModbusTCP": true,...
2019-07-21 00:14:37
962
原创 Angular中设置想要达到元素hover效果的API
背景： 最近项目中遇到需要设计导航栏的菜单，移动到某一导航标签时，需要显示一个隐藏的TAG。参考了一下淘宝导航栏的设计，发现他们也是使用水平方向的ul，在每个li里嵌入div来布局。项目需求 是在移动到某个img时候，触发一个向下的子菜单区域，所以我的思路是：将img和子菜单区域的div外层套一个container，对container进行hover操作。方法： 在Angular4中就有了(...
2019-07-18 00:46:12
3775
原创 如何使一个ul变成水平方向上的无序列表
正常的ul是垂直排列的，但是如果想要设置成一行的元素的话，可以按照以下步骤：先去掉列表的点，css: ul {list-style-type:none;}其次将li设置浮动 float:right / left；如果想要整个ul向左或者向右对齐，可以直接对ul设置float:left/right。...
2019-07-18 00:31:50
1768
原创 JS关于DATE的常用点
因为项目里经常设计JS 中的Date对象，故来整理一下常用的构建和方法。实例化new Date(); 返回当前日期new Date(value); value是一个代表时间的字符串，例如“December 17, 1995 03:24:00”new Date(dateString); dateString: 一个ISO字符串“1995-12-17T03:24:00”new Date(y...
2019-07-12 08:36:17
139
原创 固定DIV于页面底部和滚动条一起滚动
CSS固定div且随滚动条滚动项目需求是将二维码固定在页面上，随页面滑动。弱点：css position 值及其对应的效果。.QRcode{ display:block; bottom:10px; right:20px; width:110px; height:120px; position:fixed;}...
2019-07-11 17:29:53
1700
原创 Angular中使用ng-pick-datetime的event来触发一些函数修改一些属性
记录一下项目里用ng-pick-datetime包来载入日历控件本来这一块是同事写的，今天有个新的需求要控制所选时间段长度最大为一天，就看了下同事代码学习了一下。记录一下今天的TRAP。先上代码。HTML：<div id="start-form" class='form-group'> <h3>FROM： </h3> &l...
2019-07-09 20:28:19
703
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人