随笔分类 - Angular
1
摘要：1. 卸载当前版本 npm uninstall g angular cli 2. 清除未卸载干净的angular cli缓存 npm cache clean f 3. 到安装目录查看是否卸载干净 find /usr name ng 4. 若未卸载干净(第三步有内容输出)，则去到对应的目录删除；如若卸
阅读全文
摘要：说明: 组件使用了ng zorro (https://ng.ant.design/docs/introduce/zh) 第一类：嵌套表单 1. 静态表单嵌套 demo.component.html demo.component.ts 2. 动态表单嵌套 （数组式添加） 1. demo.compone
阅读全文
摘要：问题一、 iframe如何自适应屏幕高度 解决思路：通过设置iframe外层父元素高度等于window高度，再相对于父元素定位iframe元素；案例如下： 第一步: 模板文件中使用iframe 第二步: ts 中自定义iframe外层父元素的高度 问题二、 安全机制设置 错误： 解决： 第一步：创建
阅读全文
摘要：用于进入组件前的加载动画 第一步：index.html 定义动画模板和样式 第二步：路由守卫，在进入路由满足条件时取消加载 请求登陆认证接口，已登录 取消加载，进入路由；未登录 跳转至登录页，无需取消加载 加载效果预览
阅读全文
摘要：管道的作用就是将原始值进行转化处理，转换为所需要的值； 1. 新建sex reform.pipe.ts文件 2. 编辑sex reform.pipe.ts文件 3. 使用demo组件中使用自定义管道 同@Component({})和@NgModel({})一样，@Pipe({})代表这是一个管道，里
阅读全文
摘要：1. 安装ng2 codemirror包、codemirror包 2. 在所需要使用codemirror组件的模块中引入CodeMirror模块 3. 在组件html模板文件中使用codemirror组件 4. 在组件ts文件中定义codemirror组件所需要的变量; 和引入codemirror组
阅读全文
摘要：1. 安装echarts包、ngx echarts包 2. angular.json中引入echarts.js文件 3. 根模块中导入NgxEchartsModule模块 4. 组件中使用echarts图表 (1). HTML test.component.html (2). TS test.com
阅读全文
摘要：1. ng v 查看angular cli是否安装成功、angular cli的版本号 2. ng new 项目名称 新建angular项目 3. ng g class 类名 动态生成类文件； 4. ng g i 接口名 动态生成接口文件； 5. ng g c 组件名 动态生成组件，并把这个组件导入
阅读全文
摘要：1. 安装ngx toastr包 2. package.json中引入toastr样式文件 3. 根模块中导入Toastr模块 4. 组件中使用toastr提示框 可以对提示框进行配置 参数说明: closeButton：false，是否显示关闭按钮（提示框右上角关闭按钮）； debug：false
阅读全文
摘要：步骤： 创建第三方包 》 开发第三方包 》 测试第三方包 》 发布第三方包 》 使用第三方包 实例: 第一步：创建第三方包;; (创建项目，项目下创建第三方库) 1. 新建项目 2. 创建第三方库 === 目录结构 （多了projects目录） 第二步：开发第三方包；；(在第三方库中新建组件、模块)
阅读全文
摘要：1. javascript解决异步编程方案 解决javascript异步编程方案有两种，一种是promise对象形式，还有一种是是Rxjs库形式，Rxjs相对于Promise来说，有好多Promise没有的特性和功能，使用起来更便捷简单； 2. Rxjs 简单介绍 Rxjs 是Reactive Ex
阅读全文
摘要：解析视图: 连接到模板的嵌入视图，在组件模板元素中添加模板(DOM元素、DOM元素组) 连接到组件的嵌入视图，在组件元素中添加别的组件 使用类说明： 单个HTML元素；用于获取DOM元素； 一组HTML元素；可以用来创建ViewRef类型的视图(TemplateRef元素实例.createEmbed
阅读全文
摘要：1. 文件上传 本地可同时选择多个文件 将本地所选择的文件列出来 单个文件上传至服务器； 删除本地选择的文件 样式使用了bootstrap的样式 1. html file.component.html 文件上传按钮 文件列表(文件名称、状态、操作 删除、上传) 2. ts file.componen
阅读全文
摘要：拖动元素到指定区域 拖放的同时传递数据 1. 安装 ng2 drag drop 2. 模板中配置可拖拽元素 draggable 表明此元素时可拖拽的 [dragData] = 'item' 在拖动过程中将item数据从draggable到droppable [dragScope]="'system'
阅读全文
摘要：1. MergeMap 串联请求 后一个请求需要前一个请求的返回结果时，需要使用串联请求。 可以使用 实现， 优势是减少嵌套，优化代码； 代码如下: import {HttpClient} from '@angular/common/http'; import {mergeMap} from 'rx
阅读全文
摘要：1. style.propertyName 效果: 2. ngStyle 效果: 3. ngClass 效果:
阅读全文
摘要：1. 组件中元素动画应用: 显示隐藏元素动画, 需要将动画应用在需要动画的元素上；动画应用格式[@动画名]=“动画状态名称” 2. 切换路由动画应用: 路由切换时组件进场/ 出场动画；需要将动画应用在切换的组件的最外层元素上； routerLink(Directive) 链接到指定的路由; rout
阅读全文
摘要：1. 路由 Angular路由: 可以控制页面跳转；可以在多视图间切换； 2. 路由守卫 Angular路由守卫： 在进入或离开某路由时，用于判断是否可以离开、进入某路由；；； 代表可以进入当前路由； 代表不可以进入当前路由，但可以进入自定义的路由； 3. 路由守卫与路由的关系 路由守卫只只能应用于
阅读全文
摘要：1. 配置开发环境、测试环境、生产环境 (1). : 用于程序开发 （创建项目时自动生成） (2). : 用于程序完成，测试产品 (手动创建) (3). : 测试完成，可对外开发 (创建项目时自动生成) 2. 配置angular.json, 使构建的时候，可替换为相应的环境文件； 第一步. 复制pr
阅读全文
摘要：第一种形式: 传字符串 第一步: 组件传参; 选择routerLink或navigate形式 (1). routerLink配置形式 (transmiteData= JSON.stringify({name: '11', id: '22'}); JSON字符串) (2). navigate配置形式
阅读全文
1
浙公网安备 33010602011771号