发表于： 2019-11-08 21:59:17
0 858
今天完成的事情：
每天整理angualr学习的知识点
做路由守卫（进行中）
补充ES6基础
整理下css常用代码进行中）
准备复盘PPT(进行中)
准备各个任务的知识点(进行中)
明天计划的事情：
整理复盘PPT和任务各个知识点
遇到的问题：无
收获：
CSS整理
| 列表 | |
| 线索Cues | 笔记Notes |
.三种列表 | (1)有序列表<ol><li> (2)无序列表<ul><li> ul中只能嵌套li，而li可以嵌套任意标签。 (3)定义列表<dl><dt><dd> 是标题及列表项的结合。 |
| 表格基本结构：单元格、行、列 | (1)<table><tr><th><td> (2)HTML5中已废除table的border属性，用css控制边框宽度。 (3)跨列(横跨)：<td colspan="所跨的列数">内容</td> 跨行(竖跨)：<td rowspan="所跨行数">内容</td>，两者都要删除被合并的其他单元格。 (4)表格特点：同行单元格高度一致且水平对齐，同列单元格宽度一致且垂直对齐。 |
| 视频元素 | (1)controls属性提供播放暂停和音量控件、autoplay属性自动播放、loop属性循环播放 <video src="视频路径" controls="controls">你的浏览器不支持video标签</video> (2)source元素链接不同的视频文件，浏览器会自动选择第一个可识别的格式： <video controls> <source src="video/video.webm" /> <source src="video/video.mp4" />你的浏览器不支持video标签 <video> |
| 音频元素 | 使用语法和视频元素一样，只要把video换成audio即可。 |
| .HTML5的结构元素 | (先划分结构再写内容)： header(头部)、footer(脚部)、 section(独立区域)、article(独立文章内容)、 aside(相关内容或应用,常用于侧边栏)、nav(导航类辅助内容) <iframe>框架:方便在页面中引用站外的页面内容。 <iframe name="此框架的标识名" src="引用的页面地址"></iframe> <iframe>和锚链接的结合：使锚链接的内容在iframe框架中打开 <iframe name="mainFrame" src="框架引用的页面地址" /> <a href="链接路径" target="mainFrame">点击在框架中打开</a> |
| 线索Cues | 笔记Notes |
| token 数据 | 这个是后端数据给你的，通过把用户ID和密码专递到后台数据然后返回参数里面会告诉你传递的数据时否正确以及写好的token数据 |
| window.sessionStorage.setItem('auth',this.a.name); | JS数据保存 来保存你获得的数据，但我这里没有token所以我这里是用账户号来当token,保存后得到数据在调试里面查看如图下   我们发现key那就有我们的保存的值，就是用保存的值来判断页面上面有没有户名名称。 |
创建一个服务来放 authGuard.service.ts import { CanActivate,Router } from '@angular/router'; | 代码 主要在于 CanActivate 它是路由守卫主要核心功能,通过CanActivate 这个接口来进行判断的吧，这里面应该是angular封装好的. canActivate(){ const cs = window.sessionStorage.getItem('auth'); if(!cs){ this.route.navigate(["/log/"]); } return true; } 在这个服务里面获取我们上面存储的数值，通过路由来进行判断有没有这个数值如果没有就跳转登陆页面如果有就继续执行下去。 注意： 这个判断可以在每个组件里面TS文件填写，之所以创建一个服务是不用在每个文件来判读有没有这个值，把它放在app路由就会在跳转这个路由的时候会先跳转到这个服务来进行判断。 |
| canActivate | 主要是通过 canActivate 守卫来关联 服务路由代码如下 import { AuthGuard } from './auth/authGuard.service'; { path: 'list', canActivate:[AuthGuard],/在进入list路由之前会先进入AuthGuard路由 进行验证 loadChildren: './pages/list/list.module#ListModule' }, 这就相当于你要跳转那个路由就在那个路由下加这个服务判断，如果判断成功继续跳转如果判断不成功那么就是跳转不过去： 注意 必须要申明 providers:[AuthGuard] //如果不声明这个是用不了这个服务的 |
| 总结Summary | |
| 这个路由主要是通过我们保存的数据来进行判断，当然如果你后台数据有token 数据 可以拿来进行判断没个页面有没有 token 数据 这个数据，如果你没有就自己保存一登陆账户或者密码来拿这个 当token 数据 进行判断。通过声明一个服务来把判断放进去，然后通过路由跳转的时候当每次你要跳转这个路由页面要先跳进这个服务里面进行判断有没有你登陆的后拿到token 数据数据不然你是不能跳进去的。 | |
返回列表
评论