Ionic Cordova Sqlite 实现保存用户名登陆
1.添加sqlite 组件
cordova plugin add https://github.com/litehelpers/Cordova-sqlite-storage.git --save
2.编写代码 app.js =>run=> $ionicPlatform.ready 添加
if(window.cordova ) {
ltdb = $cordovaSQLite.openDB({name: "ltapp.db", location: 1});
//创建用户表
$cordovaSQLite.execute(ltdb, "CREATE TABLE IF NOT EXISTS users (id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT, email TEXT, phonenumber INTEGER, password TEXT)"); $cordovaSQLite.execute(ltdb, 'SELECT COUNT(*) FROM users ').then(function (res) {
if (res.rows.length < 0) {
var query = "INSERT INTO users (name,email,phonenumber,password) VALUES ( ?, ?, ?, ?)";
$cordovaSQLite.execute(ltdb, query, ['admin', 'sulin11026@163.com', '13683365354', '123']).then(function (result) {
console.log("success");
}, function (error) {
})
}
},
function (error) {
console.log(error);
}
);
}
controllers .js
controller('LoginCtrl',['$scope', '$state', '$ionicPopup', 'AuthService', function($scope, $state, $ionicPopup, AuthService) {
$scope.login = function() {
var user= $scope.user;
AuthService.login(user.uname, user.pwd).then(function(authenticated) { $state.go('tabs.home', {}, {reload: true});
$scope.setCurrentUsername(user.username);
}, function(err) {
var alertPopup = $ionicPopup.alert({
title: '登录失败',
template: '请输入正确的账号密码!'
});
});
};
}])
servcies.js
.factory('AuthService',['$q', '$http','$cordovaSQLite', function($q, $http,$cordovaSQLite) {var username = '';var login = function(name, pw) {
return $q(function(resolve, reject) {
try {
$cordovaSQLite.execute(ltdb, "SELECT * FROM users WHERE name = ? ",[name]).then(
function(res) {
if (res.rows.length > 0) {
if(pw.toLocaleUpperCase()==res.rows.item(0).password.toLocaleUpperCase()){
resolve('Login success.');
}
}else{
reject('Login Failed.');
}
},
function(error) {
reject('Login Failed.');
}
);
}
catch(ex){
}
});
};return {
login: login
};
}])
index.html
<ion-view class="login" hide-nav-bar="true" style="z-index: 1" cache-view="false">
<form ng-submit="login()" name="theform">
<div id="login">
<div class="logo"><img src="img/fixed/logo.png"></div>
<div class="fill">
<label class="item item-input ion-ios-person-outline">
<input type="text" placeholder="账号" ng-model="user.uname"
ng-focus="hide='1'" ng-blur="hide='1'" ng-required="true" >
</label>
<label class="item item-input ion-ios-locked-outline">
<input type="password" placeholder="密码" ng-model="user.pwd" ng-required="true"
ng-focus="hide='1'" ng-blur="hide='1'" >
</label>
<label class="btn">
<button class="button button-block button-light" type="submit">登录</button>
</label>
</div>
以上测试正常通过,如果有问题需要耐心慢慢调试
Ionic Cordova Sqlite 实现保存用户名登陆的更多相关文章
- 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo
目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...
- ionic 使用sqlite
昨天被ionic和sqlite折腾一天,怎么也无法实现读取,后来才发现,原来是codova中的sqliteplugin版本问题. 问题:Database location or iosDatabase ...
- 基于ionic+cordova+angularJs从零开始搭建自己的移动端H5 APP
这里详细介绍下如何用ionic+cordova+angularjs搭建自己的移动端app,包括环境搭建,框架使用等,具体项目已放置在github上,可下载下来自行启动. 下载地址:https://gi ...
- ionic+cordova+angularJs
ionic+cordova+angularJs 这里详细介绍下如何用ionic+cordova+angularjs搭建自己的移动端app,包括环境搭建,框架使用等,具体项目已放置在github上,可下 ...
- cookie保存用户名及密码
登陆页中,用户输入用户名密码,点击提交,后台对照mysq数据库中,看是否有对应的用户名,以及密码是否正确.如果正确 则将用户名密码分两份Cookie保存.页面跳转到登陆成功页. 用户再次访问登陆页时, ...
- 用户登录保存数据实例(慕课笔记 使用SharedPreferences保存用户名)
学习视频之后自己操作时的笔记. 0.视频地址:http://www.imooc.com/video/3265 1.功能预览: 说明:1)输入错误用户名和密码,点击登录,弹出提示框“禁止登录”: 2)输 ...
- NSUserDefaults保存用户名和密码
#import "ViewController.h" @interface ViewController () @property (weak, nonatomic) IBOutl ...
- Ionic Cordova 调用原生 Api 实现拍照上传 图片到服务器功能
Ionic 调用 Device 设备 Api 获取手机的设备信息 1. 找到对应的Api: https://ionicframework.com/docs/native/device/ 2. 安装相关 ...
- Ionic + Cordova 跨平台移动开发环境配置
1.下载安装JDK(根据各自系统选择32位或64位下载),安装完成之后需要做以下环境变量配置 在“系统变量”中,设置3象属性,JAVA_HOME,PATH,CLASSPATH(大小写无所谓),如果已经 ...
随机推荐
- thinkphp 闭包支持
闭包定义 我们可以使用闭包的方式定义一些特殊需求的路由,而不需要执行控制器的操作方法了,例如: 'URL_ROUTE_RULES'=>array( 'test' => function() ...
- C/C++语言实现单链表(带头结点)
彻底理解链表中为何使用二级指针或者一级指针的引用 数据结构之链表-链表实现及常用操作(C++篇) C语言实现单链表,主要功能为空链表创建,链表初始化(头插法),链表元素读取,按位置插入,(有序链表)按 ...
- day18_文件处理_迭代器_生成器
#!/usr/bin/env python # -*- coding:utf-8 -*- # ********************day18_文件处理_迭代器_生成器 ************** ...
- 响应式编程(Reactive Programming)(Rx)介绍
很明显你是有兴趣学习这种被称作响应式编程的新技术才来看这篇文章的. 学习响应式编程是很困难的一个过程,特别是在缺乏优秀资料的前提下.刚开始学习时,我试过去找一些教程,并找到了为数不多的实用教程,但是它 ...
- Java中关于注释、标识符、变量、常量、数据类型、类型转换、转移字符以及数值型的表现形式的详解
Java文件的注意事项 在同一个Java文件中,可以定义多个类,但是被public修饰的类只能够有一个,并且此类名要与文件名一致. 在同一个类中,可以定义多个方法,但是名字叫做main的方法只能有一个 ...
- 【Oracle】如何在查询视图时使用索引
通常我们使用hint来固定查询计划选择走表的索引 固定表的连接等等,但是如果第一层查询的是视图呢? yang@rac1>CREATE TABLE TA (ID NUMBER, NAME VARC ...
- java_网络编程之上传文件案例
初期成果: 客户端: package FileUpload; import java.io.*; import java.net.Socket; import java.util.Scanner; p ...
- spring-data-JPA repository自定义方法规则
一.自定义方法的规则 Spring Data JPA框架在进行方法名解析时,会先把方法名多余的前缀截取掉,比如find,findBy,read,readBy,get,getBy,然后对剩下的部分进行解 ...
- A*算法——第K短路
例题 JZOJ senior 1163第K短路 题目描述 Bessie 来到一个小农场,有时她想回老家看看她的一位好友.她不想太早地回到老家,因为她喜欢途中的美丽风景.她决定选择K短路径,而不是最短路 ...
- Spring Cloud Alibaba发布第二个版本,Spring 发来贺电
还是熟悉的面孔,还是熟悉的味道,不同的是,这次的配方升级了. 今年10月底,Spring Cloud联合创始人Spencer Gibb在Spring官网的博客页面宣布:阿里巴巴开源 Spring Cl ...