初学前端跨平台，水平尚浅，如有错误多多指教。
由于ionic包含在angular外层（或者可以理解为ionic为angular的一个扩展套件 ps:对于手机跨平台开发来说,cordova也可以理解为ionic的一个套件或者angular的套件之一，用来桥接前端页面和手机原生功能），因此ionic项目有着和angular同样的工程目录结构（如图1）：
其中,index会作为app或页面应用启动加载时的入口，一般会在其中对app的基本配置进行声明（如各类基本JS库的引入，相关app在不同平台的配置信息等(如angular的基本库等，另外，cordova的配置也需要在这里进行，且默认ionic项目是没有配置cordova的[印象中，详细参考cordova配置教程]，需要手动配置或通过cordova命令行命令生成项目)）。main.ts在项目build时会被typescript转译成main.js，且默认声明在index中，为启动应用做准备。main.ts中声明了angular的启动模块，也叫根模块(即目录中的app.module.ts)，由此开始是app的主要编程部分（使用typescript）。根模块用来对app的主要组件及框架提供的已有功能进行声明，引入，也可以做一部分逻辑处理，之后再行详述。app.component.ts，可以理解为根组件。下面详细介绍app.component.ts。
在原文中有这样一句阐述：“我们是这样写 Angular 应用的：用 Angular 扩展语法编写 HTML模板， 用组件类管理这些模板，用服务添加应用逻辑， 用模块打包发布组件与服务。”angular4（或ionic3）的主要想法是，将项目应用拆分为各类组件（或服务等，其实服务也可以叫理解为就是组件，只是缺少某些东西）。各类组件由.html和.scss或.css的文件与.ts文件一一对应且相互结合，形成具有一定功能的基本组件（大至页面，小至bar甚至botton等,由自己决定）。再由这些组件组成较大的模板，再根据app的相应功能或需要声明在根模块中，由此组成一个可以使用的应用。在这些组件中，有的通过组件内的.ts文件中的方法(或函数)调用，有的则通过页面跳转功能调用。总体上来说，angular4的项目就是由分散内聚的功能组件组合而成。由使用者的使用需求去启动相应功能（懒加载）。
通过ionic3的CLI命令快速建立的自带tabs（签页）项目源文件可以更明确的看到这个思路。首先在app.module.ts中，声明项目需要引入的各个组件。如图2:
其中，例如myApp,AboutPage.. 等等，均是子组件或子模块。App应用的功能均由这些组件或模块组合实现。因此需要在根模块中声明才能使用。
在app.component.ts中（图3），@Component()指明了根组件对应的.html（展示）。constructor为MyApp实例化提供了基本的构造方法。platform.ready().then()方法返回了系统平台加载的信息。至此app的启动加载和准备才算完成。同时由于Angular4会对组件类自动进行实例化（即自动读取constructor并实例化）,因此Myapp类也就隐藏的被实例化了。实例化的同时提供了一个变量rootPage，并为其赋值TabsPage。在文件头，import {TabsPage}form '../pages/tabs/tabs' ，将文件tabs引入了根组件中。因此有必要观察tabs。如图4:
Tabs中引入了三个类，分别是AboutPage,ContactPage 和 HomePage。并在类装饰器中声明了模板目标，同时类tabspage中声明了三个变量,一一对应至.html中的<ion-tab>标签中。至此就讲Homepage,Aboutpage等三个页面和tabs绑定在了一起。[root]作为<ion-tab>的固定用法，可以理解为一个空白的tab容器（或向系统预先申请的一个空间，具体想了解可以去学习angular4有关属性型指令的内容），在需要加载时，才会具体加载指定的内容，如三个tabTitle中的一个。
至此，可以理解，angular4（ionic3）应用的构成方式，即为将内容独立内聚的组件一个个组合成需要的部分，再由用户需求去调用。
