weixin_39150852的博客

Angular CLI应用程序环境的局限性每种环境都需要单独的构建:构建时要求您为每个环境生成不同的配置,应用程序代码一旦更改,则需要为每个环境运行一次编译打包命令,这样既耗时又影响开发效率将应用程序配置部分存储在应用程序代码存储库中可能会带来安全风险。问题描述: 在实际开发过程中,稍微大点的angular项目打包一次可能会耗时半个小时解决方案: 在不重新构建Angular应用程序的情况下，将我们的Angular应用程序部署在具有不同配置的不同环境（阶段，生产，客户端A，客户端B等）中1.在应

Http拦截器就是拦截发出的请求，对其进行统一添加额外处理，然后放行；对响应进行拦截并作出业务上的判断，决定是否给与返回1.定义req.interceptor.ts文件(以‘.interceptor.ts’作为后缀)import { Injectable } from '@angular/core';import { HttpInterceptor, HttpEvent, HttpHand...

大小写转换<p>{{str | uppercase}}</p>//大写<p>{{str | lowercase}}</p>//小写json转换为字符串<p>{{peopleInfo| json}}</p>日期格式化 <p>{{today| data:"yyyy-MM-dd HH:mm:s...

应用初始化钩子函数ngOnInit // 在angular应用初始化的时候执行， Angular在创建组件后立刻调用它 // 页面刷新时会触发该生命周期函数 // 一般用于请求数据 ngOnInit(){ // 锚点改变事件, 当前 URL 的锚部分(以 '#' 号为开始) 发生改变时触发 window.onhashchange=...

前端加密解密1.安装：npm install crypto-js2.创建一个crypto.service.ts服务文件// crypto.service.tsimport { Injectable } from '@angular/core';import Crypto from "crypto-js";@Injectable()export class CryptoServic...

问题:在无网络的情况下图标无法正常显示,且浏览器会报错解决方案请求地址位于使用地址位于将请求地址替换成本地资源地址1.在src根目录下新建一个replace.less文件,用于自定义参数覆盖ant design原有样式2.在angular.json配置该less文件3.下载本地字体图标资源,放在assets目录下的font文件夹里链接: https://pan.baidu....

搭建本地环境,配置瓦片数据,下载文件并找到相应路径链接: https://pan.baidu.com/s/1c6nfZodGBzUxyG2PhmFzPA提取码: p3qi开启本地服务器导入本地包链接: https://pan.baidu.com/s/1qhe4kxwpmez5-7dBVA1S1g提取码: w6hp将文件解压放到asset文件夹在index.htm...

routerLinkActive指令在路由激活时添加样式class采用路由高亮：当路由被激活时允许你添加一个class在你添加路由的dom元素上，只有url变化时才会移除此样式。父路由链接激活默认情况下，当路由为链接的父路由或者完全匹配链接，链接都会认为是激活的状态。<a routerLink="/a/b" routerLinkActive="active">B链接</...

1、用于页面传参(订阅实时监视着数据的变化)html传递参数：<a [routerLink]="['/tab4','改变参数']" [queryParams]="{id:123123123123}" >改变路由参数后的tab4</a>ts配置：import {ActivatedRoute,Router} from '@angular/router';constr...

angular 中使用TinyMCEhttps://blog.youkuaiyun.com/qq_39785489/article/details/81361044

组件：<nz-date-picker [nzFormat]="'yyyy-MM-dd'" [nzDisabledDate]="disabledDate" style="width: 100%" name="startDate" [(ngModel)]="formInfo.startD...

//导入import { DatePipe } from '@angular/common';//构造器 constructor(private datePipe: DatePipe ) { }//js使用this.basicFormInfo.birthday = this.datePipe.transform(this.basicFormInfo.birthday, 'yyyy-M...

1、定义子组件html代码（这里使用了Ant Design Mobile的组件）：<Navbar [leftContent]="'返回'" [icon]="icon" [rightContent]="null" (onLeftClick)="onLeftClick()"> {{name}}</Navbar>&l...

在实际项目开发中，一些具有相同功能的js或ts代码我们可以封装成一个函数，使用时直接调用。这样可以减少很多重复代码，增强代码的可读性。如果是html代码重复，我们又应该怎么简化代码呢？具体方法如下：原代码： //判断baseInfo是对象还是数组 <div *ngIf="baseInfo.publicArr;else notypeBox"> //baseI...

html代码：onRefresh：必选, 刷新回调函数direction：拉动方向，可以是 up 或 downendReachedRefresh：滚动到底时自动刷新（direction=down） <PullToRefresh (onRefresh)="pullToRefresh($event)" [(ngModel)]="stat...

angualr中使用socket.io报global is not defined错误解决方案：找到polyfills.ts文件中加入(window as any).global = window;

1、创建服务ng g service 服务名ng g service 文件名/服务名2、在app.module.ts中引入并声明服务import { StorageService } from './services/storage.service'@NgModule({ providers: [StorageService], // 配置项目所需要的服务})3、在服务中...

获取DOM节点1、在html中给DOM节点起名字<div #myBox> 我是一个div</div>2、在js中引入ViewChildimport { Component, OnInit , ViewChild } from '@angular/core';3、通过ViewChild装饰器获取DOM节点@ViewChild('myBox') myBox...

get请求1、在app.module.js中引入模块并声明import {HttpClientModule} from '@angular/common/http';imports: [ HttpClientModule],2、在组件中引入模块并声明import {HttpClient} from '@angular/common/httpconstructor(priv...

路由拦截匹配不到路由的时候加载的组件或跳转的路由 import {NotFoundComponent} from './not-found.component'; { path: '**', // 任意路由 component: NotFoundComponent , // 加载的组件 /* redirectTo:'NotFoundComponen...

angular指令:标记作用域 &lt;div ng-app=""&gt; &lt;/div&gt;.双向数据绑定// 在app.module.ts主模块中导入 import {FormsModule} from '@angular/forms' imports :{ FormsModule //增加导入此模块 }/...