ionic(cordova)でsqliteを使う - ngCordova
はじめに
今回やりたかったのはsqliteを使う際に共通の処理とかはどこかにまとめておきたかった。接続とSELECT、INSERT、UPDATE、DELETEあたりをまとめられればよいかなという方針で。次回簡単に使えるようにメモしておく。
インストール
$ bower install ngCordova
index.htmlで読み込む
・・・ <script src="lib/ngCordova/dist/ng-cordova.js"></script> ・・・
実装
services/db.js
angular.module('myApp') .factory("dbService", ['$cordovaSQLite', '$q', function($cordovaSQLite, $q) { var dbService = {}; var db = null; var query = null; dbService.initialize = function() { if (window.cordova) { db = $cordovaSQLite.openDB({name: 'example.db', location: 'default'}); } else { db = window.openDatabase('example.db', '1.0', '', -1); } // データベースの初期化 query = "create table if not exists example (id integer primary key, name text)"; $cordovaSQLite.execute(db, query); }; /** * 1件取得 * @param string query * @param object params */ dbService.get = function(query, params) { var deffered = $q.defer(); $cordovaSQLite.execute(db, query, params) .then(function(result) { if (0 < result.rows.length){ deffered.resolve(result.rows.item(0)); } else { deffered.resolve(null); } }, function(err) { deffered.reject(err); }); return deffered.promise; }; /** * 全件取得 * @param string query * @param object params */ dbService.getAll = function(query, params) { var deffered = $q.defer(); $cordovaSQLite.execute(db, query, params) .then(function(result) { var result2 = []; for (var i = 0; i < result.rows.length; i++) { result2.push(result.rows.item(i)); } deffered.resolve(result2); }, function(err) { deffered.reject(err); }); return deffered.promise; }; /** * 登録 * @param string table * @param object data */ dbService.insert = function(table, data) { var deffered = $q.defer(), params = [], fields = "", values = ""; Object.keys(data).forEach(function(key) { fields += key + ","; values += "?,"; params.push(data[key]); }); query = "insert into " + table + " ("; query += fields.substr(0, fields.length - 1) + ") values ("; query += values.substr(0, values.length - 1) + ")"; $cordovaSQLite.execute(db, query, params) .then(function(result) { deffered.resolve(result.insertId); }, function(err) { deffered.reject(err); }); return deffered.promise; }; /** * 更新 * @param string query * @param object params */ dbService.update = function(query, params) { var deffered = $q.defer(); $cordovaSQLite.execute(db, query, params) .then(function(result) { deffered.resolve(result.rowsAffected); }, function(err) { deffered.reject(err); }); return deffered.promise; }; /** * 削除 * @param string table * @param int id */ dbService.delete = function(table, id) { var deffered = $q.defer(); query = "delete from " + table + " where id = ?"; $cordovaSQLite.execute(db, query, [id]) .then(function(result) { deffered.resolve(result.rowsAffected); }, function(err) { deffered.reject(err); }); return deffered.promise; }; return dbService; }]);
呼び出し側 今回はコントローラから直接呼ぶ
angular.module('myApp') .controller("SampleCtrl", function($scope, dbService) { // データベース初期化 dbService.initialize(); // SELECT var sql = "select * from example where id = ?"; var params = [1]; dbService.get(sql, params) .then(function(result) { // result -> 結果 }); // INSERT dbService.insert("example", { name: "hoge" }) .then(function(result) { // result -> 結果 }); // UPDATE var sql = "update example set name = ? where id = ?"; var params = ["fuga", 2]; dbService.update(sql, params) .then(function(result) { // result -> 結果 }); // DELETE dbService.delete("example", 2) .then(function(result) { // result -> 結果 }); });
おわりに
コントローラに直接書かずにテーブルごとにserviceを用意する方がよいかも。以上です。
ionic(cordova)にてngStorageでlocalstorageを使う
bowerでインストール
$ bower install ngstorage --save
index.htmlで読み込む
・・・ <script src="lib/ngstorage/ngStorage.min.js"></script> ・・・
今回はserviceで使った。
angular.module('myApp', ['ngStorage']) .service('myService', function($localStorage) { this.getByStorage = function() { return $localStorage.myKey; }; this.setByStorage = function(value) { $localStorage.myKey = value }; });
メリットはもっとありそうだけど、とりあえず簡単に使えた。以上です。
ionic(cordova)で複数人でチーム開発するときのながれメモ
1人でやってるときは問題なかったけど、複数人でやってるときに最初うまくいかずにハマったのでメモしておく。
新規プロジェクト作成の場合
新規にプロジェクトを作成してandroid を追加(iosはデフォルトで登録済み)
$ ionic start sampleApp blank -a "アプリ名" -i com.example.sampleApp # プロジェクト作成 $ ionic platform add android # android追加 $ ionic state save # package.jsonへ保存
gitのリモートリポジトリへPUSH
$ git push origin master
別の開発者の作業
$ git clone http://path/to/repo.git $ ionic state reset
ionic(cordova)で本番環境、開発環境を切り替える
ionicに限った話じゃないかもしれないけど。
今回やりたかったのは、本番と開発でつなぎこむAPIのURL等を切り替えたりしたかった。
今回は少し調べて、node-env-fileというのを使った。
また、gulp-concatも使ってる。
今回は以下のようなファイル構成を想定。環境によって切り替えたい値はここで定義するイメージ。
www/js/config/development.js www/js/config/staging.js www/js/config/production.js
development.js
angular.module('starter.values') .value('config', { api_url: "http://example.com" });
こんなようなファイルを環境ごとにつくるイメージ。
インストール
$ npm install node-env-file
.env ファイルを新規で作成
# mode=production # mode=staging mode=development
gulpfile.jsを編集
var env = require('node-env-file'); env(__dirname + "/.env"); var conffile = "config." . process.env.mode . ".js"; gulp.task("js.concat-values", function() { return gulp.src(["www/js/config/" + confifile]) .pipe(concat("config.js")) .pipe(gulp.dest("www/build/js")); });
あとはwww/index.htmlで上記つくったファイルを読み込む
<script src="build/js/config.js"></script>
なんかヌケがありそうだけどイメージはこんな感じ。あとで追記するかも。以上です。
ionic(cordova)で横スクロールするメニューを実装するときのメモ
cssでの実装でこちらを参考にそのままいけました。
Appleに学ぶ、横スクロールナビを組む時のCSSメモ - Qiita
Horizontal Scrollable Navigation Sample
が、ionic serveでブラウザで確認したところ問題なかったのだがビルドしてアプリとして確認したところ動かず。
<ion-contet overflow-scroll="true"> ・・・ </ion-content>
overflow-scrollが必要でした。ionic serveでは動くのにアプリで動かないというのがよくわからなかったのですが。。。以上です
【mysql】特定のキーワードが入っているレコードでソートする方法メモ
こんなことができたのか
キーワードがあるものを上にもってくる。
select id, title from daily order by title like "%キーワード%" desc;
以上です
【cakephp】サブクエリを実行する方法メモ
サブクエリのサンプルメモ。
ついでにgroup by した結果のレコード数を求めるサンプル。
$dbo = $this->MyTable->getDataSource(); $subQuery = $dbo->buildStatement(array( "fields" => array("distinct MyTable.id"), "table" => "my_table", "alias" => "MyTable", "conditions" => array( "MyTable.deleted =" => 0, ), "joins" => array( "type" => "left", "table" => "other_table", "alias" => "OtherTable", "condition" => array( MyTable.id = OtherTable.my_table_id, ), ), "group" => array( "MyTable.id", ), )); $query = "select count(*) as cnt from ({$subQuery}) as tmp"; $result = $this->MyTable->query($query);
以上です。