10
2017
08

angular移除模板文件中的链接前缀“unsafe”

Use the DomSanitizer:import {DomSanitizer} from '@angular/platform-browser'; ... constructor(private sanitizer:DomSanitizer){} ... let sanitizedUrl = this.sanitizer.bypassSecurityTrustUrl('Notes://MY
10
2017
08

安卓内置浏览器以及UC浏览器打开angular4 项目空白问题的解决

问题描述:将ng build --prod --aot 打包构建生成的代码部署在web服务器,在电脑端通过浏览器(谷歌,火狐)访问项目,数据以及页面可正常加载。手机端,在安卓设备上测试QQ浏览器,在苹果手机上测试safari也可正常访问,数据加载也正常。在安卓手机上使用UC浏览器以及安卓手机自带的浏览器访问项目,会出现页面空白的问题。原因:Angular2,Angular4是面向未来的科技,要求浏览器支持ES6+,而UC浏览器以及大部分安卓手机自带的浏览器暂不支持ES6+,因此需要加一些填充库来
08
2017
08

ng build --prod打包项目出错

错误描述:ng build 打包正常,顺利生成dist;但在使用ng build --prod生成时提示错误:ERROR in ./src/main.ts Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in 'D:\phpStudy\WWW\html\zx
05
2017
08

angular与yii2配合完成数据的更新操作

angular4.3.3在angualr中执行patch/put请求,更新数据时,需要传递待更新的数据,数据格式可采用json格式,发送请求时需配置请求头信息里的参数,将Content-Type设置为application/json,如例,更新文章名称(name)的部分代码:export class ArticleService {     private headers = new 
04
2017
08

angualr4 如何获取response-header中包含的值

使用yii2官方提供的Restful功能进行接口开发,在获取列表信息时,返回的分页以及链接信息会保存在响应头信息 response-header 中,如下所示:Connection →Keep-Alive Content-Length →5491 Content-Type →application/json; charset=UTF-8 Date →Fri, 04 Aug 2017 09:55:10&
22
2017
07

(ok)遨游浏览器-极速模式 flash添加遮罩层无效

在页面放置flash元素,并对flash对象添加链接时,可通过添加一个透明的图片作为遮罩层来添加链接。问题添加遮罩后,在火狐浏览器以及遨游兼容模式下,遮罩层浮至上层,可点击跳转。在遨游急速模式下,遮罩层无法浮至上层,造成无法点击flash跳转的效果。分析及解决在调试工具中修改样式属性,添加以下属性后,透明图片(即遮罩层)浮动生效。position: fixed;总结css样式如果书写不标准会导致部分浏览器下样式渲染失败。完整代码如下:<div style="z
22
2017
07

解决angular4本地开发中跨域访问的问题

在本地进行angular项目开发时,如果需要跨域请求api来获取数据,可以通过设置代理的方法来进行跨域访问。如前端项目访问地址为:localhost:4200,api接口地址为localhost:86,配置方法如下:1,在根目录下新建代理配置文件 proxy.config.json{     "/proxyName":{         "ta
21
2017
07

Angular4中常用管道

通常我们需要使用管道实现对数据的格式化,Angular4中的管道和之前有了一些变化,下面说一些常用的管道。一、大小写转换管道uppercase将字符串转换为大写 lowercase将字符串转换为小写<p>将字符串转换为大写{{str | uppercase}}</p> str:string = 'hello'页面上会显示 将字符串转换为大写HELLO二、日期管道date。日期管道符可以接受参数,
20
2017
07

css 横向滑动设计思路

前端开发中,为了节省页面空间,有时需要在一行显示多元素,然后通过左右滑动来进行查看。特别是在页面空间极为珍贵的手机端,这种设计会被频繁用到。效果如下:实现方法:html元素<div class="container-wrap">     <div class="container">        &
19
2017
07

Ionic 2: ReferenceError: webpackJsonp is not defined

2.0.0 Breaking ChangesIn order to speed up the bundling process, we have separated node_modules code into a new, generated file called vendor.js. This means that on every change, ionic-angular, @angular, etc won't need to be processed by web
16
2017
07

(ok)angular2 UI组件-PrimeNG启动成功无样式

问题描述参照PrimeNG官网提供的PrimeNG CLI QuickStart用例,在成功启动后,添加修改等功能可正常使用,但页面元素无样式。附:《angular2 UI组件之primeNG用法》错误原因使用cnpm安装依赖模块导致依赖的模块安装不完整。cnpm install解决方案1采用npm安装(使用代理,代理环境搭建可参照《Shadowsocks 使用说明》)。npm install配置好系统代理环境并开启后,接着配置npm使用代理,记录如下:#端口请依据个人环境设
14
2017
07

前端异步通信方式的发展历程

文中所列通信方式皆基于HTTP协议,请知悉!传统我们知道,在异步通信未诞生之前,前端与服务器的数据交互是这样的:读取-顺序读取本页面所有数据;提价-以表单形式来进行提交,服务器接收存储。这个过程中不仅会传输许多无用的数据,加大服务器的流量,在用户体验上也很死板,缺少与用户的交互。这种笨重的通信方式,亟待解决。ajax诞生2005年2月,Adaptive Path公司的Jesse James Garrett在网上发表了一篇名为《Ajax:一种Web应用程序开发的新方法》的文章(现在还可以在www.
12
2017
07

npm 常用操作命令

npm install <name>安装nodejs的依赖包例如npm install express 就会默认安装express的最新版本,也可以通过在后面加版本号的方式安装指定版本,如npm install express@3.0.6npm install <name> -g  将包安装到全局环境中但是代码中,直接通过require()的方式是没有办法调用全局安装的包的。全局的安装是供命令行使用的,就好像全局
11
2017
07

ES6 的 Promise 对象

前言开篇首先设想一个日常开发常常会遇到的需求:在多个接口异步请求数据,然后利用这些数据来进行一系列的操作。一般会这样去写:$.ajax({     url: '......',     success: function (data) {         $.ajax({ &
10
2017
07

angular2 为什么要加@Input?

在这个例子中hightlightColor是HighlightDirective的一个输入型属性。我们见过它没有用别名时的代码:@Input() highlightColor: string;也见过用别名时的代码:@Input('myHighlight') highlightColor: string;无论哪种方式,@Input装饰器都告诉Angular,该属性是公共的,并且能被父组件绑定。 如果没有@Input,Angular就会拒绝绑定到该属性。Either way, th