刘敏
个人专栏

最新文章

Angular 5升级到Angular 6

Angular升级建议先到https://update.angular.io,它会根据你选择的原Angular和目标Angular版本给出一些升级建议。Angular 5升级到Angular 6升级前1、如果项目中有用到HttpModule和Http Service,把它们切换到HttpClientModule和HttpClient Service。HttpClient有几个特性:不需要调用.js

Angular 5 RouterLinkActive的用法

如果链接为当前路由(此时链接为激活状态),RouterLinkActive指令可以让我们给链接元素添加css的class样式。父路由连接激活默认情况下,当路由为链接的父路由或者完全匹配链接,链接都会认为是激活的状态。<a routerLink="/a/b" routerLinkActive="active">B链接</a>所以,示例里当路由为“/a”和“/a/b”class

Angular 5交换(重排)动态组件的位置

如果忽略了angular的组件是由数据控制的特性,很容易陷入使用dom操作控制组件。最简单的方式是使用数组存放数据,通过重排数组中的元素的位置,从而达到重排组件的效果。示例:app.tsimport {Component, NgModule, VERSION} from '@angular/core'import {BrowserModule} from '@angular/platform-br

Angular 5获取当前的路由url及参数

获取当前加载组件的路由信息可以使用ActivatedRoute。ActivatedRoute接口如下:interface ActivatedRoute {    snapshot: ActivatedRouteSnapshot   url: Observable<UrlSegment[]> &nb

JavaScript检测Chrome浏览器是否在隐身窗口

浏览器在隐身模式下,它的FileSystem API是禁用的,可以通过检测FileSystem API来判断浏览器是否在隐身窗口。function isIncognito() {  var fs = window.RequestFileSystem || window.webkitRequestFileSystem;

Angular 5配置使用service-worker

Angular 5实现了一个适用于Angular应用的Service Worker,Angular CLI 1.6也添加了对service worker的支持。使用Angular CLI对应用添加service worker的支持分两种情况:新项目应用中添加service worker在已有项目中添加service&n

Angular 4选择组件模板DOM元素(DOM操作)的方式

Angular提供了多种方式让我们获取页面的元素。主要分为两种:基于Decorator:@ViewChild,@ViewChildren,@ContentChild,@ContentChildren使用ElementRef以及querySelectorDecorator:@ViewChild,@ViewChildren,@ContentChild,@ContentChildren@ViewChil

Angular 5:HttpClient的基本用法

Angular 4.3引入了新的用于http请求的接口HttpClient。它旨在替换之前版本的接口Http。有以下新特性:对响应的body做类型检查默认返回的是JSON对象,不再需要使用json()显式解析返回的数据支持拦截器支持进度事件请求后验证和基于刷新的测试框架安装HttpClientModuleHttpClient属于@angular/common/http包的模块HttpCl

配置Nginx解决Angular 4刷新路由重新加载报404错误

Angular重新加载页面会报404,原因可分为三种:1、路由不存在2、Angular使用html5模式的路由,需要把所有路由的请求映射到index.html配置Nginx如下:location / {     root /var/html;     try_files $uri $uri/ /index.html =404;   } 其

Angular4使用Rxjs5共享Http请求返回的结果数据

在使用Angular开发的单页面应用里,有时需要处理这种场景:使用http请求某个数据,数据请求成功后需要把数据更新到多个组件里。也就是说,有多个observer(观察者)对http请求数据返回的Observable订阅。getDta() {     return this.http.get('/dataUrl').map(res&nbs