【Ionic+AngularJS 开发】之『个人日常管理』App（二） - Glife_H5之家

准备工作资源预装工具

安装bower

npm install -g bower

安装ngCordova

bower install ngCordova

（*由于网络获取资源的原因，后面几次建项目后都无法下载到，自己便复制了原来的ngCordova目录（到YourProject\wwww\lib目录下），发现也是可以使用的）

下载好后，在项目的index.hmtl进行引用：

日历工具

FullCalendar

安装插件

本项目需要（安装）的插件有：

插件名说明扩展阅读

cordova-plugin-x-toast 消息提示，使用方法如：$cordovaToast.showShortBottom('屏幕下方提示');
（*仅限平台运行，浏览器调试无效，所以在PC调试时应注意其引起的错误而导致后面代码没执行） cordova ionic消息提示

cordova-sqlite-storage sqlite数据库 cordova调用本地SQLite数据库的方法
more...

cordova-plugin-x-socialsharing 内容分享

插件的安装基本命令是：

cordova plugin add XXXX

安装好后可在YourProject\wwww\lib目录下看到新增的插件目录，这样就可以在项目中引用了（不用使用<script src="xxx">）。
在生成platform后，或需再用

cordova prepare

该命令用以复制文件到平台（并更改一些xml文件的内容）

概念理解 service服务

AngularJS服务是一种单例对象，其主要功能是为实现应用的功能提供数据和对象，通过直接调用服务，可以将复杂的应用功能进行简化或分块化。按功能的不同，分为内置服务和自定义服务。

AngularJS提供的常用内置服务有：$scope、$http、$window、$location等

自定义服务主要包含以下两种：
1）使用内置的$provide服务
2）调用模块中的服务注册（如factory、service、constant、value等方法）

本项目主要采用service来创建服务（service方法与factory不同的是，它可以接收一个构造函数）

设计与开发 app.js

1 angular.module('pdm' 2 , ['ionic' 3 , 'ngCordova' 4 ]) 5 .config(function ($stateProvider, $urlRouterProvider, $ionicConfigProvider) { $ionicConfigProvider.tabs.position('bottom'); }) 13 .run(function ($ionicPlatform) { }) .service('$alertPopup', 19 ['$ionicPopup' 20 , function ($ionicPopup) { (content, title) { 22 if (title == undefined || title == null)title = '提示'; 23 var alertPopup = $ionicPopup.alert({ 24 title: title, 25 template: content 26 }); 27 28 alertPopup.then(function (res) { 29 log('alertPopup.then: ' + res); 30 }); 31 } 32 }]) .service('$db', ['$cordovaSQLite', '$alertPopup', '$cordovaToast' 36 , function ($cordovaSQLite, $alertPopup, $cordovaToast) { db = null; 39 try { 40 var _dbName = 'sk'; 41 if (!(window.cordova && window.SQLitePlugin)) { db = window.openDatabase(_dbName, '1.0', _dbName, 100 * 1024 * 1024); db.transaction( 48 function (transaction) { 49 transaction.executeSql("CREATE TABLE IF NOT EXISTS Finacial_KeepAccount " + 50 "( id integer primary key" + 51 ", account text " + 52 ", SuitType text " + 53 ", ItemText text " + 54 ", MoneyFlowDirect text " + 55 ", Cash REAL " + 56 ", AccountType text " + 57 ", RecordDate text " + 58 ", Remark text" + 59 ")"); 60 } 61 ); $cordovaSQLite.execute(db, 'CREATE TABLE IF NOT EXISTS Life_DailyActivity(id integer primary key' + 66 ', account text' + 67 ', Date text' + 68 ', Business text' + 69 ', Study text' + 70 ', Health text' + 71 ', Sport text' + 72 ', Others text' + 73 ', Remark text' + 74 ')'); 75 76 } 77 else { 78 $alertPopup('fail create ' + _dbName + '.db'); 79 } 80 } catch (e) { 81 $alertPopup('fail init: ' + e.toString(), '$db Err'); 82 } db_exec(sql, param, succ_callback, err_callback){ 86 if (param == undefined || param == null) param = []; 87 $cordovaSQLite.execute(db, sql, param) 88 .then(function (rst) { 89 if (succ_callback == undefined)log('exec: ' + sql); 90 else succ_callback(rst); 91 }, function (err) { 92 if (err_callback == undefined)$alertPopup('exec error: ' + err.message); 93 else err_callback(err); 94 }); 95 } { _exec: function (sql, param, succ_callback, err_callback) { 101 db_exec(sql, param, succ_callback, err_callback); 102 }, get: function (tbl, cndt, callback) { 105 var sql = 'SELECT * FROM ' + tbl + ' WHERE 1=1 '; 106 if (cndt != undefined && cndt != '')sql += (' AND ' + cndt); 107 db_exec(sql, [], 108 function (rst) { 109 var data = []; 110 for (var i = 0; i < rst.rows.length; i++) data.push(rst.rows.item(i)); 111 callback(data); 112 }); 113 }, add: function (tbl, fields, valueArr, silenceExec) { 116 var _param = ''; 117 for (var i = 0; i < fields.split(',').length; i++)_param += ',?'; 118 _param = _param.substr(1); 119 var sql = 'INSERT INTO ' + tbl + '(' + fields + ') values(' + _param + ')'; 120 db_exec(sql, valueArr, 121 function (rst) { 122 if (silenceExec == undefined || silenceExec != true) 123 if(!g_debug) 124 $cordovaToast.showShortCenter('add to ' + tbl + ' success'); 125 }); 126 }, update: function (tbl, fields, valueArr, cndt, silenceExec) { 129 var fv = ''; 130 var flds = fields.split(','); 131 for (var i = 0; i < flds.length; i++) fv += (', ' + flds[i] + '=? '); 132 fv = fv.substr(1); 133 var sql = 'UPDATE ' + tbl + ' SET ' + fv + ' WHERE ' + cndt; 134 db_exec(sql, valueArr, 135 function (rst) { 136 if (silenceExec == undefined || silenceExec != true) 137 if(!g_debug) 138 $cordovaToast.showShortCenter('update ' + tbl + ' success'); 139 }); 140 }, : function (tbl, cndt, silenceExec) { 143 var sql = 'DELETE FROM ' + tbl + ' WHERE ' + cndt; 144 db_exec(sql, [], 145 function (rst) { 146 if (silenceExec == undefined || silenceExec != true) 147 if(!g_debug) 148 $cordovaToast.showShortCenter('delete from ' + tbl + ' success'); 149 }); 150 } 151 152 } 153 }]) ;

View Code

自定义服务：$alertPopup

为方便项目内调用，对$ionicPopup进行封装，也方便日后扩展。

自定义服务：$db