http://www.jianshu.com/p/d94324b722af

背景

  • 用ionic2开发过一两个小功能的朋友都会发现,每新建一个页面都需要在\src\app\app.module.ts中添加页面对应的class
  • 当app页面很多时都会感觉比较乱,分不清哪跟哪.更让人接受不了的是当多人同时开发,经常修改app.module.ts,会经常造成代码冲突
  • 所以我们需要把页面按模块再细分

代码结构

  • 我的app按功能分了4个子模块,分别为contact、home、login和mine.具体代码结构如下图

    按模块划分创建多个子模块

代码详情

  • 如下图,以home.module.ts代码为例,注意不同颜色的标注
  • 新建的子module,记得要添加到总模块中

    home.module.ts

其他

    • 完整代码已上传到github

Ionic2实战——按模块划分app 创建多module的更多相关文章

  1. angularJs项目实战！01：模块划分和目录组织

    近日来我有幸主导了一个典型的web app开发.该项目从产品层次来说是个典型的CRUD应用,故而我毫不犹豫地采用了grunt + boilerplate + angularjs + bootstrap ...

  2. 实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  3. 实战使用Axure设计App,使用WebStorm开发(6) – 迈向后端

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  4. 实战使用Axure设计App,使用WebStorm开发(5) – 实现页面功能

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  5. 实战使用Axure设计App,使用WebStorm开发(4) – 实现页面UI

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  6. 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  7. 实战使用Axure设计App,使用WebStorm开发(3) – 构建页面架构

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  8. Android 设计随便说说之简单实践（模块划分）

    上篇随笔随(Android 设计随便说说)便说了一下什么是设计以及设计的原则,这里举一个简单的例子来进一步的说Android设计.我们以应用商店的设计来举例. 在设计之前,需要把握两部分内容,才能使得 ...

  9. 模块划分--MVVM指南（课程学习）

    实现流水化开发,需要使用“模块划分”的程序开发方式.如此,团队里的每个人负责某项\某几项特定的技术领域,在特定的技术领域更加专业.这样,每个人的效率更高.在专业的技能更熟练,更深入,也会提高队员的成就 ...

随机推荐

  1. linux系统中的单引号和双引号

    一.为什么用quoting 前面说到,命令行在内容上主要由literal(一般文字)和meta(元字符)组成,而meta又由IFS.CR和其他字符组成(如=,$, > 等),通常这些原元字符都有 ...

  2. 面向对象的JavaScript-005-Function.prototype.call()的3种作用

    1. // call的3种作用 // 1.Using call to chain constructors for an object function Product(name, price) { ...

  3. java中List的用法和实例详解

    java中List的用法和实例详解 List的用法List包括List接口以及List接口的所有实现类.因为List接口实现了Collection接口,所以List接口拥有Collection接口提供 ...

  4. 4.4.6 数组也能无锁：AtomicIntegerArray

    数组也可以实现cas操作,有以下几个类以及用法如下: public class AtomicTntegerArrayTest { public static void main(String[] ar ...

  5. ServiceStack.Redis.RedisNativeClient的方法“get_Db”没有实现。

    项目中用到redis,用nuget导入,但是运行时遇到问题 Exception: “Com.JinYiWei.Cache.RedisHelper”的类型初始值设定项引发异常.System.TypeIn ...

  6. Qt编译，imp_CommandLineToArgvW@8问题

    Tested msvc2013. The linker can not find _imp_CommandLineToArgvW@8. It's in shell32.lib. I see qtmai ...

  7. CentOS下的Git服务器

    [Gitosis]CentOS下的Git服务器:Gitosis  [摘要]         详细介绍如何在CentOS上配置Gitosis        我们很多人知道Git可能是从Github开始的 ...

  8. Codeforces 691E Xor-sequences（矩阵快速幂）

    You are given n integers a1,  a2,  ...,  an. A sequence of integers x1,  x2,  ...,  xk is called a & ...

  9. spark 编译命令

    mvn -Pyarn -Phadoop-2.4 -Dhadoop.version=2.4.0 -DskipTests clean package

  10. [转]一次Delete&Insert引发的Mysql死锁

    近日遇到一个比较奇怪的deadlock错误, 错误详情: Deadlock found when trying to get lock; try restarting transaction; nes ...