HTML5手机APP开发入(3)

课程内容:

按照AngularJs MVC框架进行代码重构,新建一个DataService服务类使用SQLite插件实现储存对通讯录的本地存储。

涉及的知识点:

Angular2 Injectable的使用熟成的模块依赖注入

引用类库

引用SQLite插件和 Storage,SqlStorage模块

重构代码

新建一个Model

新建一个modules目录,新建一个contact.ts,定义一下字段的类型

新建一个dataService

引用类或plugin pack

import {Storage,SqlStorage} from 'ionic-angular';

import {Contact} from '../modules/Contact';

关键字

@Injectable()

表示可以依赖注入的

注册新建的服务

修改app.ts

注入自定义服务类

import {DataService} from './pages/services/dataService';

providers:[DataService],

使用DataService

引用类库

import {Contact} from '../modules/Contact';

import {DataService} from '../services/dataService';

注入服务

private dataService:DataService

Run Test

OK 完成

下次讲如何开发自定义组件(Component),实现模块化开发

HTML5手机APP开发入(3)的更多相关文章

  1. HTML5手机APP开发入(5)

    HTML5手机APP开发入(5) 回顾一下 HTML5手机APP开发入(4) 如何自定义Component,directive HTML5手机APP开发入(3) 如何实现MVC的代码重构,自定义一个P ...

  2. HTML5手机APP开发入(4)

    HTML5手机APP开发入(4) 课程内容 完成一个自定义的Component用来展现通讯录用户的明细信息如下图 http://bootsnipp.com/snippets/featured/prof ...

  3. HTML5手机APP开发入门(2)

    HTML5手机APP开发入门(2) 课程内容 使用IonicFramework v2 + angular 2 完成一个简单的联系人列表的操作,有三个页面: ListPage,DetailPage,Ad ...

  4. HTML5手机APP开发入门(1)

    HTML5手机APP开发入门(1) 开发框架 Ionicframework V2 + Angular 2 具体内容可以参考一下网站 http://ionicframework.net/ http:// ...

  5. [转帖]H5 手机 App 开发入门:技术篇

    H5 手机 App 开发入门:技术篇   http://www.ruanyifeng.com/blog/2019/12/mobile-app-technology-stack.html 阮一峰老师的文 ...

  6. 【转帖】H5 手机 App 开发入门:概念篇

    H5 手机 App 开发入门:概念篇 http://www.ruanyifeng.com/blog/2019/12/hybrid-app-concepts.html 作者: 阮一峰 日期: 2019年 ...

  7. 手机app开发:浅谈APP登录方式的优劣

    手机app开发公司亿合科技要是给你一个机会设计一款APP,你会用什么方式做这个APP的登录模块?根据APP的业务模型的不同会有不同的设计方法.如果是偏内容型的APP,需要优先展示内容给用户,当用户需要 ...

  8. 未来一年的13大手机APP开发趋势

    无论是欢呼出租车,保存票据,订购披萨还是在线购物,您可以立即联系到什么设备?你的智能手机 这是您需要的朋友,在如何查找信息和简化日常任务方面发挥着不可或缺的作用. 移动技术以光速增长; 我们不能否认手 ...

  9. 示例浅谈PHP与手机APP开发,即API接口开发

    示例浅谈PHP与手机APP开发,即API接口开发 API(Application Programming Interface,应用程序接口)架构,已经成为目前互联网产品开发中常见的软件架构模式,并且诞 ...

随机推荐

  1. 自动化运维工具之ansible(转)

    原文链接:http://os.51cto.com/art/201409/451927_all.htm

  2. freeCodeCamp:Confirm the Ending

    检查一个字符串(str)是否以指定的字符串(target)结尾. 如果是,返回true;如果不是,返回false. /*思路 字符串长度str.length等于字符串位置str.indexOf() + ...

  3. IntelliJ IDEA 目录技巧

    IntelliJ IDEA的Web应用的目录结构 Ø 目录图: Ø 目录解释: 开发目录 目录名称 描述 Test 工程名称 lib Jar包的存放目录 src 源文件也就是文件(类,资源文件)存放的 ...

  4. iOS多线程编程之NSOperation和NSOperationQueue的使用(转自容芳志专栏)

    转自由http://blog.csdn.net/totogo2010/ 使用 NSOperation的方式有两种, 一种是用定义好的两个子类: NSInvocationOperation 和 NSBl ...

  5. VS2010中使用GDAL(一)

    初次使用visual studio 对工具不熟悉,有些步骤可以配置的 (1)在VS2005中新建win32控制台程序 testGDALconsole,(向导中附加选项不能选为空项目) 将C:\GDAL ...

  6. RHEL5.8设置OpenSSH的X11 Forwarding功能

    X11的Forwarding功能需要在SSH中进行设置,RedHat Enterprise Linux5.8默认使用的而是OpenSSH,现将设置方法记录如下: OpenSSH配置文件路径: /etc ...

  7. PyCharm 4.5.4 环境配置

    1.去掉“自动保存功能” pycharm默认是自动保存的,习惯自己按 ctrl + s 的可以进行如下设置: 菜单File -> Settings... -> Appearance &am ...

  8. EmberJs之使用Ember-Data

    写在前面 最近比较忙,换了新工作还要学习很多全新的技术栈,并给自己找了很多借口来不去坚持写博客.常常具有讽刺意味的是,更多剩下的时间并没有利用而更多的是白白浪费,也许这就是青春吧,挥霍吧,这不是我想要 ...

  9. codepage IMLangCodePages

      http://baike.baidu.com/link?url=78DSTGAri8dvHNLQ03rThSKieJqhFwFWL4sQMao6cfaRSOUWN88QVBwmSJPCZch0vf ...

  10. javascript中的splice方法介绍&示例

    javascript 中的 splice 方法很强大,它可以用于插入.删除或替换数组的元素. 下面来一一介绍! 删除:用于删除元素,两个参数,第一个参数(要删除第一项的位置),第二个参数(要删除的项数 ...