angular
chanchaw
这个作者很懒,什么都没留下…
展开
-
Angular 多级路由实现登录页跳转 - 给小白
Angular 通过多级路由实现登录页跳转为你节省时间本文受众是 Angular 初学者,没有多级路由使用经验,不知道登录页面与主页跳转的实现逻辑,相反,看到这里你就可以结束了,不要浪费时间。下面来看看小白对于登录页面的理解:上图中左边是导航菜单栏,右边的空白区域是 <router-outlet> 所在区域,即所有实现业务逻辑的组件都在这里显示 - 点击左边导航栏的项目右侧...原创 2019-11-19 12:37:44 · 1868 阅读 · 0 评论 -
微信模板消息详情页空白,Angular 项目404 的解决方法
微信服务号模板消息详情页打开空白页面问题描述正常运行的微信服务号,突然间发现模板消息的详情页打开是空白页面了(是不是自己动了什么?完全没印象)试了3个品牌的安卓手机:小米、华为、魅族,打开都是空白页(手机上),苹果手机可以打开,PC端Chrome 和 QQ浏览器 都可以正常打开,使用微信开发者工具也可以正常打开。网上搜索很多帖子说是 SSL 证书链不完整导致,而苹果手机不受该影响所以可以正...原创 2019-11-07 15:12:48 · 451 阅读 · 0 评论 -
Nginx 中部署 Angular 项目遇到的坑
Nginx 中部署 Angular 项目遇到的坑巨坑网上搜索Angular 项目编译后部署到 Nginx 中的方法,多数文章都介绍了需要在 Nginx 中的配置文件的 location 中特别指定跳转到首页来避免刷新导致404的问题,那么完整的server 代码是:server { listen 80; server_name 192.168.190.131;...原创 2019-10-23 14:30:36 · 868 阅读 · 0 评论 -
Angular DevExtreme DataGrid 国际化 中文
DevExtreme 实现国际化的步骤创建项目根据官方的Getting Started的网址 https://js.devexpress.com/Documentation/Guide/Angular_Components/Getting_Started/Create_a_DevExtreme_Application/创建项目在 cmd 中使用命令 npx -p devextreme-cl...原创 2019-06-22 13:37:41 · 1482 阅读 · 0 评论 -
nz-form inline 模式下多类型控件打乱布局的问题
nzForm 布局被打乱nz-form 布局被打乱的原因表单样式使用行内:[nzLayout]="'inline'"表单中使用多中类型的控件(input、datepicker、select…)会出现日期选择控件没有充满,同时 select 控件会被挤到下一行,看看下面的效果使用官方的样式类设置统一宽度解决在模板对应的CSS中使用下面的样式设置统一宽度/* 通过设...原创 2019-07-12 14:04:25 · 869 阅读 · 0 评论 -
Angular PrimeNG Table Sticky 的用法
PrimeNG Table Sticky 的用法先牢骚,官方给的代码用在 Angular8 和 RxJS6 版本上有兼容的问题,主要是 RxJS6 有很多 breaking changes,下面贴出来自己验证过成功的代码 - 2019年7月30日 13:15:31...原创 2019-07-30 15:29:49 · 1016 阅读 · 0 评论 -
Angular 中使用 FineReport ,不显示报表直接打印预览
Angular 直接打印预览在项目 index.html 的头部引入 FineReport 相关的 js 文件<script type="text/javascript" src="/femisnsb/ReportServer?op=emb&resource=finereport.js"></script>注意上面的 femisnsb 是项目名称,编译后...原创 2019-08-13 12:29:41 · 1098 阅读 · 3 评论 -
Angular + Java + FineReport 嵌入式部署
Angular 项目中访问 FineReport打开新窗口的方式访问 FineReport2019年8月12日 20:17:52 官网看了N多解决方法到目前为止只成功了一个方法使用标签 a 打开新窗口来访问报表下面介绍部署步骤:将 Eclipse 编译得到的 war 包拷贝到 Tomcat 目录 d:\apache-tomcat-9.0.16\webapps下,启动 Tomcat 其...原创 2019-08-12 20:32:06 · 504 阅读 · 0 评论 -
Angular 引入外部 js 文件的方法(引入 jQuery)
Angular 引入外部 js 文件的方法(引入 jQuery)在 tsconfig.json 中设置允许使用外部 js,如下图下载 jQuery 文件拷贝到项目的目录:assets/lib 下(这里的 lib 是自己创建的目录)保证 angular.json 中有对于 assets 的声明调用方法:import * as ejs from 'src/assets/...原创 2019-08-13 07:53:30 · 10817 阅读 · 0 评论 -
Angular中修改第三方组件的样式 - zorro日期选择器右端不对齐的BUG
在一列上同时使用zorro的日期选择器和input组件会出现右端不对齐的BUG(nzSpan设置为一样)上图中3个表单项:单据日期、开票、交货方式,nzSpan数值是一样的,可以看到日期选择器和下面的“交货方式”右端没有对齐在浏览器控制台中层层展开后到达下面的路径:可以看到ant-calendar-picker是日期选择器组件的官方提供的样式,在该样式下手动追加属性wi...原创 2019-02-20 14:50:33 · 1134 阅读 · 0 评论 -
Angular7 ng-zorro-antd 制作右键菜单
没多少逻辑,就直接贴代码了下面是html模板的代码:<ul nz-menu [style.width]="300" [nzTheme]="'dark'" [nzMode]="'inline'" [nzInlineCollapsed]="isCollapsed"> <li nz-menu-item (contextmenu)="conte原创 2019-02-14 10:18:42 · 1827 阅读 · 0 评论 -
Angular 全局监听键盘事件
技术点:使用EventManager根模块中不要引用,组件模块中引用import { EventManager } from '@angular/platform-browser';组件constructor中实例化对象constructor(private eventManager:EventManager){}在ngOnInit中注册全局监听ngOnInit(): void {...原创 2019-02-09 18:15:27 · 5084 阅读 · 8 评论 -
WEB前端 键盘事件 在angular中的处理
angular.module("mainModule",['ng']).controller("mainController",function($scope,$http){ // 键盘按键事件的执行 // 在工号上回车则切换焦点到密码上 // 在密码上回车则执行登录 $scope.keyEvent = function($event){ if (...原创 2018-07-23 17:07:37 · 1550 阅读 · 0 评论 -
Angular4 使用GET向后端请求数据
Angular4 使用GET向后端请求数据 在工程的src/app/app.module.ts的头部引入http、jsonp: import { HttpModule,JsonpModule } from '@angular/http'; 在工程的src/app/app.module.ts的imports下注入依赖: HttpModule,Jsonp...原创 2018-08-05 14:03:14 · 5365 阅读 · 1 评论 -
Anglar 中A标签(超链接)设置不可用的方法
a标签没有disabled属性,所以要自己手动制作不可用状态设置颜色为灰色停用事件响应设置鼠标样式为默认样式 - 选择用的箭头样式使用ngClass为a标签设定样式&lt;a (click)="insertNodeSibling()" [ngClass]="{'disableA': brotherNodeDisabled}"&gt;新增同级&am原创 2018-12-18 13:33:43 · 2207 阅读 · 2 评论 -
Angular 中自定义a标签样式为不可用
a标签设置为不可用a标签没有disabled属性,所以要自己手动制作不可用状态设置颜色为灰色停用事件响应设置鼠标样式为默认样式 - 选择用的箭头样式使用ngClass为a标签设定样式<a (click)="insertNodeSibling()" [ngClass]="{'disableA': brotherNodeDisabled}">新增同级</a...原创 2019-01-12 12:34:30 · 1227 阅读 · 0 评论 -
ng-zorro-antd 标签组件tag 实现回车连续新增
zorro tag 实现编辑状态、连续新增先看实现效果官网给的示例只有新增、删除,并且不可连续新增。自己制作实现这两个状态。下面直接贴代码了模板中代码:<span *ngFor="let tag of tags;let i=index;"> <nz-tag *ngIf="tag.visible" [nzMode]="i === -1...原创 2019-01-13 08:48:44 · 1469 阅读 · 0 评论 -
Angular6 中设置标签元素获得焦点
打开某个页面就使指定的标签元素获取焦点,下面的贴图依次按照html模板、ts控制器的顺序制定在线源码https://stackblitz.com/edit/angular-srcat3?embed=1&amp;file=src/app/app.component.html...原创 2019-01-09 09:53:39 · 3598 阅读 · 0 评论 -
Angular 标签元素 input 回车切换焦点
创建指令ng g directive shared/ccDirective/nextTab指令的全部源码:import { Directive, HostListener, ElementRef } from '@angular/core';@Directive({ selector: '[next-tab]'})export class NextTabDirective {...原创 2019-01-09 10:17:40 · 2062 阅读 · 1 评论 -
安装指定版本(老版本)的PrimeNG
由于兼容问题,有时候还是要安装老版本的PrimeNG的,ng-zorro-antd也可以参照本方法卸载已有版本:npm uninstall primeng --save清理缓存:npm cache verify安装老版本:npm install primeng@x.x.x --save,其中的x.x.x是版本号截止2019年1月22日PrimeNG是7.0.4,前一个稳定的大版本号是6....原创 2019-01-22 12:34:38 · 1676 阅读 · 1 评论 -
Angular 中使用AJAX从后台获取数据
这里要吐槽下了,WS的JSP页面中没有angular的智能提示?好了,下面开始正文。1. HTML中引用angular.js - 这好像是废话了。2. 下面先介绍JS代码:// 登录验证angular.module("mainModule",['ng']).controller("mainController",function($scope,$http){ $s...原创 2018-07-23 16:39:14 · 8121 阅读 · 0 评论