1、Ionic2新特性

①组织结构与框架:

  在Ionic2中,每个组件、页面都只专注于做一件事,它单独有自己的一个目录,有自己的类(Class)、模板文件(Template)和自己的样式文件(在这里我们提倡使用scss);

②命令行工具:

  在开发中,我们总希望能够有一个规范使得我们的开发更具有合理性,同时还能提升我们的开发效率,那么ionic2的CLI完全可以满足你这一点。

③路由导航:

  Ionic2的路由导航不同于Ionic1,我们都知道其实Anngular1自带理由是比较弱的,在复杂路由跳转的app中,是很吃力的,我 们一般都是依赖Angular1的插件ui-router,它是基于URL的hash(当然官方也提供配置切换到html5模式),那么ionic1也是 在这个基础之上进行导航封装的,比如说页面导航堆栈。

④模板的语法结构:

  ionic2的模板语法与Ionic1非常相似,但是看起来又有点古怪,其实Ionic2的模板语法更为简洁。例如:

  • ionic1:
<img ng-src="{{photo.image}}" />
  • ionic2:
<img [src]="photo.image" />

我们看一下 事件调用:

  • ionic1:
<button ng-click="doSomething()">
  • ionic2:
<button (click)="doSomething()">

⑤编译:
 
 ionic从平台上讲是基于cordova的封装( 不仅仅是它的CLI 
),因此ionic工程也是一个标准的cordova工程,也就是说我们最终给跨平台提供的是www目录的资源文件,但是在ionic2中我们都是在 www的同级目录的app目录进行编码,也是因为我们使用EM6或Typescript写的代码浏览器并不能够直接执行,如果你自己观察ionic2的工 程目录,你会发现Gulp.js的脚本多了几个任务的定义,其实是几个ionic的钩子命令,如ionic 
serve,ionic build之类的,其目的是在我们打包,或者浏览器模拟时的 
命令执行之前,执行一些gulp任务,其中就是对typescript、scss的编译,是不是感觉很方便,而且最终合并编译到www/build/js目录下,并且很难反编译,也就是说你的app如果被人解包,他只能运行,但如果想拿到你的源码是相当困难的。

Ionic1与Ionic2的更多相关文章

  1. ionic3懒加载IonicPage使用报错

    ionic3.X版本有不少亮点.作为从angular1到ionic1.ionic2一直用它们开发单页面应用的使用者来说,一直存在的一个痛点就是,将整个项目作为网页不打包成app的话,第一次加载时间太长 ...

  2. Ionic2优于Ionic1的6个理由

    经历了一个从0到有的app的开发,我已经很熟悉Ionic1了,在此期间我曾发现过Ionic1的一些bug,和一些不合理的地方(根基版本 不同,后续我会陆续发表这些文章),我甚至在此期间对Ionic1进 ...

  3. ionic2+angular2中踩的那些坑

    好久没写什么东西了,最近在做一个ionic2的小东西,遇到了不少问题,也记录一下,避免后来的同学走弯路. 之前写过一篇使用VS2015开发ionic1的文章,但自己还没摸清门道,本来也是感兴趣就学习了 ...

  4. ionic2+angular2

    ionic2+angular2中踩的那些坑 好久没写什么东西了,最近在做一个ionic2的小东西,遇到了不少问题,也记录一下,避免后来的同学走弯路. 之前写过一篇使用VS2015开发ionic1的文章 ...

  5. 认识ionic2

    1. Ionic 2 介绍 Ionic 2专注于以标准的HTML.CSS和JavaScript来构建移动站点,并可以通过Cordova打包成移动 App,只需编写一次代码,就可以分别部署到iOS.An ...

  6. IONIC2新建项目并添加导航

    一.   基础搭建 1.      新建IONIC2项目 ionic start myApp tabs --v2 不加--v2会新建ionic1的项目 2.      运行项目 cd myApp io ...

  7. ionic2新手入门整理,搭建环境,创建demo,打包apk,热更新,优化启动慢等避坑详解

    onic官方文档链接:http://ionicframework.com/docs/ 如果是新的环境会有很多坑,主要是有墙,请仔细阅读每个步骤 文档包含以下内容: l  环境搭建 l  创建demo并 ...

  8. ionic2简单分析

    Angular2是一个全新的框架,它从ReactJS以及其他web移动框架借鉴了不少经验和优点,巨大的改进使得开 发体验和性能已经超越了Angular1,而且Ionic2无论是从UI交互效果和跨平台的 ...

  9. ionic1页面切换动画卡顿优化

    https://github.com/shprink/ionic-native-transitions https://www.npmjs.com/package/ionic-native-trans ...

随机推荐

  1. 什么是Java Marker Interface(标记接口)

    先看看什么是标记接口?标记接口有时也叫标签接口(Tag interface),即接口不包含任何方法.在Java里很容易找到标记接口的例子,比如JDK里的Serializable接口就是一个标记接口. ...

  2. javascript基本类型和引用类型,作用域和内存问题

    基本类型(null.undefined.boolean.number.string)和引用类型(Object 对象) 1  基本类型:只能不存一个值,一种类型:从一个变量向另一个变量复制基本类型的值, ...

  3. 转载:使用Auto Layout中的VFL(Visual format language)--代码实现自动布局

    本文将通过简单的UI来说明如何用VFL来实现自动布局.在自动布局的时候避免不了使用代码来加以优化以及根据内容来实现不同的UI. 一:API介绍 NSLayoutConstraint API 1 2 3 ...

  4. 并查集+思维——The Door Problem

    一.问题描述(题目链接) 有n个门和m个开关,每个开关可以控制任意多的门,每个门严格的只有两个开关控制,问能否通过操作某些开关使得所有门都打开.(给出门的初始状态). 二.问题分析 大部分开关问题首先 ...

  5. 产生式模型(生成式模型)与判别式模型<转载>

    转自http://dongzipnf.blog.sohu.com/189983746.html 产生式模型与判别式模型 产生式模型(Generative Model)与判别式模型(Discrimiti ...

  6. ueditor中FileUtils.getTempDirectory()找不到

    2014-6-27 14:22:25 org.apache.catalina.core.StandardWrapperValve invoke SEVERE: Servlet.service() fo ...

  7. ios之UIActionSheet

    UIActionSheet是在IOS弹出的选择按钮项,可以添加多项,并为每项添加点击事件. 为了快速完成这例子,我们打开Xcode 4.3.2, 先建立一个single view applicatio ...

  8. 表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的

    jQuery代码 <input value="请输入用户名" type="text"> <input value="请输入密码&qu ...

  9. 《c++编程思想》关于虚函数在构造函数行为的理解,理解有误,望告知!

    <c++编程思想>书上有一段话:在任何构造函数中,可能只是部分形成对象——我们只能知道基类已被初始化,但并不知道哪个类是从这个基类继承来的.然而,虚函数在继承层次上是“向前”和“向外”进行 ...

  10. Django模型中字段属性choice的使用

    根据Django官方文档: from django.db import models class Student(models.Model): FRESHMAN = 'FR' SOPHOMORE = ...