Angular4自定义组件及数据绑定--（进度条）
初学Angular4的时候，发现跟AngularJs（Angular1.x）有很大的不一样的，继承了Java类的思想,摒弃了JS，采用Typescript，用起来感觉轻量很多。结合Ionic3进行项目开发，组件性强，开发效率得到了大大的提高。
根据项目功能的开发需要，需要做一个进度条。根据Angular的特性，写了一个组件，利用@Input()的特性做数据的双向绑定，对数据进行互传，应用在项目中。
一、创建Ionic3 component 组件
（1）执行Ionic g component progress-bar,执行成功后，会发现目录下的components中生成了progress-bar的文件夹。
（2）组件HTML代码的编写，如下progress-bar.html。
（3）组件的数据交互，通过@Input()，来实现数据交互，如下progress-bar.ts。
（4）组件样式的实现,如下progress-bar.css。
分别完成了progress-bar.html、progress-bar.ts、progress-bar.css后，组件就创建完毕了。
二、使用Ionic3component progress-bas组件
（1）将上面步骤创建的component progress-bas组件，引入到app.module.ts。
导入之后，才可以在html页面里面使用该组件。
（2）在需要使用该组件的html页面，进行使用。
（3）到这里了，该组件就已经完成创建和使用啦！如下就是该组件完成后的效果图。
在创建这个组件的时候只用到了@Input()，@Input()是父组件将数据传递给子组件。还有一个属性是@Output()，它是子组件传递数据给父组件。结合@Input()和@Output()属性，就可以编写子组件与父组件的双向数据交互了。
