Alexsel

本期为Angular系列的第一篇文章，我会从这里搭建Angular sample项目、组件库、主题、然后每个组件等。使之成为一个比较通用的组件库系列文章，目的有二：1、自己在写系列文章过程中不断夯实基础、不断学习补缺；2、分享给一些不熟悉angular及自定义组件的同学，使之快…

上一篇文章已经搭建好了angular sample框架以及包含主题的组件库，这一篇开始自定义组件，第一个组件button，想一下按钮的功能很简单，即点击事件，多思考一下，还包括大小、颜色（主题控制），hover效果等。 1. 添加button组件：lib下面每个组件分开一个文件…

上一篇中讲了button组件的编写，这篇说一下checkbox组件 --- 多选框，可以勾选、取消勾选，禁用，支持NgModel、reactive forms，支持勾选事件监听等。 1. 和button一样，新建一个checkbox文件夹，添加相应的文件如下： 2. 添加col…

前面一篇我们自定义了checkbox组件，然后顺便把通用mixin写上了，而且实现了checkbox组件的NgModel和Reactive forms两种绑定。这一篇我们继续来自定义radio-button组件，这个组件和checkbox比较类似，只不过这个是一组单选框，即在一…

这篇我们自定义input输入框组件，同样支持NgModel和reactive forms，支持验证自定义message提醒，支持浮动label，支持自定义主题色等。1. 第一步同样是新增一个input

这篇我们自定义tabs组件，支持自定义主题色，动态增减隐藏tab，动态选择tab，禁用tab，自定义tab头部等。1. 第一步同样是新增一个tabs文件夹，新增相应的文件如下：tabs和tab两个组件

Angularjs的项目一般用js比较多，使用的是js + less/css + html模式，那么如何将这里的js转换为ts写法，使之能够支持es5 & es6语法，支持强类型语法提示及提高开发效率

前面一篇文章说了如果将已有的js切换到ts，这篇文章会说项目中如果来了新的需求，如何用ts写新增的需求。我们还是以ts & html & less为结构，如下：比如这次我们做活动案例添加了一个comp