Angular开发总会遇到诸多的问题,这里我将自己在开发中遇到的主要问题总结一番,方便自己偶尔翻查,也兴许能够帮大家解决些问题。

说明:*本文持续更新*,所贴代码由于篇幅限制,有些只是部分,建议直接去GitHub-ISSUE中去看

目录

  1. [innerHTML]中的JavaScript不能执行吗?
  2. 同时订阅路由参数和查询参数即params和queryParams
  3. 多异步请求并行处理
  4. *ngFor遍历对象属性
  5. 组件类的继承性
  6. 如何使组件样式超出组件作用域
  7. 下拉列表选项布尔类型转换
  8. 模板标签
  9. CLI下index.html页面未模板化,如何动态更改内容
  10. CLI下如何添加第三方CSS
  11. httpclient下的拦截器使用

[innerHTML]中的JavaScript不能执行吗?

阅读全文 »

如何学习Angular ???

数码产品买新不买旧,语言框架一定程度上我也这么认为,最新技术,一定要有所了解和掌握,去年Google发布了Angular,也就是我们之前说的2,当然现在请不要叫2,否则你就很二,也烦不要叫AngularJS,官方已经声明,AngularJS指的是1,以后就是Angular,因为它并不只支持js写法,可以使用TS、JS、Dart三种语言写法,所以叫Angular,当然对于书写语言,我遵从官方推荐的语言写法-TypeScript。

进入正题,如何学习?以下为我认为的正确姿势。

  1. 看官网,明白框架的特性、特点,带着几个疑问

    • Angular是干嘛的?
    • 什么是前端框架?
    • Angular跟TypeScript什么关系?
    • Angular有哪些功能,特点?
    • .etc,不过这些问题,正是官网要告诉你的,都会有
  2. 了解TypeScript,快速将官网文档,看一遍即可,明白两点:1,typescript是面向对象语言,2,typescript是JavaScript的超类,时刻别忘记这两点。

  3. 快速入门,将官网的英雄之旅快速走完

  4. 基础章节,高级章节,也需要看一遍,但是当你看完基础章节,之后就可以从事项目开发;

    开发之前,你要确保自己已经理解了这几个基本概念

    • 模块
    • 组件
    • 管道
    • 指令
    • 服务类
  5. 在开发中,不断咀嚼理解这些基本术语,理解基本术语背后的思想,强化自己的认知,久而久之,你真正的会了Angular-一个简单而强大的框架

阅读全文 »

做移动网站开发,或者写技术博文,有时候是需要制作手机或桌面操作的GIF图,效果如下,这种方式其实挺有利于读者或用户通过动画迅速了解你想表达的目的。

那这样一个GIF动画如何制作的,其实分两步,视频录制->视频到GIF截取转换,以下为我在使用中用到的工具

视频录制

  • QuickTimeMAC,自带软件
阅读全文 »

Postman是一款强大的API调试工具,在执行post请求时候会发现body有4种格式选项,那么这四种各是什么含义,及使用场景呢,各方检索后,总结如下

虽然Postman中看到的是form-data,x-www-form-urlencoded,raw,binary,但真实提交的数据格式并不是这4种方式,而是multipart/form-data,application/x-www-form-urlencoded,application/json,text/xml。

application/x-www-form-urlencoded

When a web browser sends a POST request from a web form element, the default Internet media type is “application/x-www-form-urlencoded”.[8] This is a format for encoding key-value pairs with possibly duplicate keys. Each key-value pair is separated by an ‘&’ character, and each key is separated from its value by an ‘=’ character. Keys and values are both escaped by replacing spaces with the ‘+’ character and then using URL encoding on all other non-alphanumeric[9] characters.

以上描述摘自WIKI

阅读全文 »

在进行angular项目开发时,使用webpack进行打包,最近频繁出现了JavaScript heap out of memory即内存溢出,查找资料,找到了解决办法,这里记录下

解决方法

本质问题是,项目打包所需要的性能开销,超过了v8缺省的内存限定,需要修改下配置

1. 构建脚本中配置

阅读全文 »

在利用ionic或者直接使用Cordova开发会经常遇见些问题,这里总结下,本文持续更新

代号、标记和细分版本 (Build) 号关系

代号 版本 API级别
Nougat 7.1 API 级别 25
Nougat 7.0 API 级别 24
Marshmallow 6.0 API 级别 23
Lollipop 5.1 API 级别 22
Lollipop 5.0 API 级别 21
KitKat 4.4-4.4.4 API 级别 19
Jelly Bean 4.3.x API 级别 18
Jelly Bean 4.2.x API 级别 17
Jelly Bean 4.1.x API 级别 16
Ice Cream Sandwich 4.0.3-4.0.4 API 级别 15,NDK 8

最新最全信息,点击查看官网文档

阅读全文 »

最近在进行mysql数据迁移时遇见了这个错误,推断是mysql版本差异性带来的问题,我的A、B机器MySQL版本分别是5.6和5.7

原因

Google了一把,发现原来是MySQL-SQL Mode的问题。

解决

阅读全文 »

关于语言孰优孰略,吵来吵去,甚是无聊,语言是工具,语言的背后是思想,对你口,合适即可。
客观来说,php也是优秀的语言,繁荣这么多年,差不到哪。

由于一些老项目是php开发的,必须保证开发机具备PHP环境,所以这里将php环境搭建记录下

Windows

推荐使用phpstudy,下载地址

注明:phpstudy没有mac版

阅读全文 »

Xcode模拟器使得在没有真机设备的时候方便对APP进行模拟测试,在使用中也会碰到一些问题,这里总结下

模拟器卸载

在xcode-components下可以看到已下载的各个系统版本的模拟器

比如想删除某个版本的模拟器,直接进入/Library/Developer/CoreSimulator/Profiles/Runtimes,删除目标模拟器

阅读全文 »

测试网站或者制作移动网页截图,使用对应真机设备是一种方式,但在特定场景下也不免效率和成本偏高,Chrome浏览器自带的device mode可以完美模拟各种移动设备的分辨率,
另外还Chrome提供了截图功能。

问题

由于Chrome提供的设备毕竟有限,所以有时会需要添加自定义设备,但是最近在使用自定义设备,进行截图的时候,发现截图出来的是空白页面。

效果如下图

看了一遍自定义设备参数,对比测试,最终找到了原因,原来添加自定义设备这个时,Device pixel ratio这个参数是不能为空,否则即会出现截图为白屏即空白的情况。
如下图,我手动设定为1

阅读全文 »
0%