ionic学习记录(三)
2016-06-23 15:28
246 查看
从现在开始进入了一种新的状态,对ionic多少熟悉了,进入了优化界面与修改bug的阶段;
1、onchange 绑定ngModel
ngChange指令是angularJs的一个内置指令,其功能类似于js的onchange,监测输入内容的变化,常用于表单,与ngModel连用。
比如,在select标签里面,我想实现点击option时触发一个事件,然后返回选中的该值。
<select id="" name="" ng-model="user.location" ng-change="getUserLocation">
<option ng-repeat="location in locations" ng-value="location" ng-bind="location"></option>
</select>
这样写就可以了,下面是controller的内容:
angular.module("user.controllers",[])
.controller('testController',function($scope){
$scope.getUserLocation = function(){
console.log($scope.user.location)
}
})
如果在上面的html里面不写ng-model,只写了ng-change的话,会提示如下错误:
Controller 'ngModel', required by directive 'submitRequired', can't be found!
这只是select标签中,在input标签中,同样适用:
<input type="text" ng-model="modalName" ng-change="eventName" />
2、ionic 验证是否登录绝好的方法
在.run 或者 .config 中监听state的变更事件,也就是在路由去加载每个页面之前就判断登录状态,来决定要不要加载该页面,还是跳转到登录页去。
.run(function($ionicPlatform, $rootScope, $ionicHistory,$state) {
var needLoginView = ["myclass","mycomment","myfavorite","myquestion","orderlist"];//需要登录的页面state
$rootScope.$on('$stateChangeStart',function(event, toState, toParams, fromState, fromParams, options){
if(needLoginView.indexOf(toState.name)>=0&&!$rootScope.isLogin){//判断当前是否登录
$state.go("login");//跳转到登录页
event.preventDefault(); //阻止默认事件,即原本页面的加载
}
})});
3、ionic中保活的方法
4、网络超时
1、onchange 绑定ngModel
ngChange指令是angularJs的一个内置指令,其功能类似于js的onchange,监测输入内容的变化,常用于表单,与ngModel连用。
比如,在select标签里面,我想实现点击option时触发一个事件,然后返回选中的该值。
<select id="" name="" ng-model="user.location" ng-change="getUserLocation">
<option ng-repeat="location in locations" ng-value="location" ng-bind="location"></option>
</select>
这样写就可以了,下面是controller的内容:
angular.module("user.controllers",[])
.controller('testController',function($scope){
$scope.getUserLocation = function(){
console.log($scope.user.location)
}
})
如果在上面的html里面不写ng-model,只写了ng-change的话,会提示如下错误:
Controller 'ngModel', required by directive 'submitRequired', can't be found!
这只是select标签中,在input标签中,同样适用:
<input type="text" ng-model="modalName" ng-change="eventName" />
2、ionic 验证是否登录绝好的方法
在.run 或者 .config 中监听state的变更事件,也就是在路由去加载每个页面之前就判断登录状态,来决定要不要加载该页面,还是跳转到登录页去。
.run(function($ionicPlatform, $rootScope, $ionicHistory,$state) {
var needLoginView = ["myclass","mycomment","myfavorite","myquestion","orderlist"];//需要登录的页面state
$rootScope.$on('$stateChangeStart',function(event, toState, toParams, fromState, fromParams, options){
if(needLoginView.indexOf(toState.name)>=0&&!$rootScope.isLogin){//判断当前是否登录
$state.go("login");//跳转到登录页
event.preventDefault(); //阻止默认事件,即原本页面的加载
}
})});
3、ionic中保活的方法
.factory('keepLiveService', function ($rootScope, $timeout,$interval,$http) { var mystop; var toDo = function () { console.log("Hello World"); var serviceURL = 'http://' + sessionStorage.getItem('serviceHost') + ':' + sessionStorage.getItem('servicePort'); $http({ method: 'GET', url: serviceURL+'/efdsefw',// ?storeId=+ $scope.storeId + '&beginDate=' + '2016/06/09' + "&endDate=" + '2016/06/20',//+'&employeeId='+$scope.persionInfo.employeeId //data: $scope.formData,//pass in data as strings // data: fd, data: '', headers: {'Content-Type': undefined}, transformRequest: angular.identity }).success(function (data) { }).error(function (error) { }) }; /** * fn:一个将被反复执行的函数。 delay:每次调用的间隔毫秒数值。 count:循环次数的数值,如果没设置,则无限制循环。 invokeApply:如果设置为false,则避开脏值检查,否则将调用$apply。 Pass:函数的附加参数。 $interval(fn,delay,[count],[invokeApply],[Pass]); */ mystop = $interval(toDo, 1000); var stopNow = function () { $interval.cancel(mystop); } return { startKeepLive: function () { return toDo(); }, stopKeepLive: function () { return stopNow(); } } })
4、网络超时
$http({ method: 'POST', url: $scope.serviceURL + '/mobile/session', //data: $scope.formData,//pass in data as strings data: fd, headers: { 'Content-Type': undefined, 'token': uuid }, timeout:5000, transformRequest: angular.identity })
相关文章推荐
- 善用GIMP(Linux下的Photoshop),图像处理轻松又自由
- UVa 401 Palindromes(简单字符串)
- Flink流计算编程--在双流中体会joinedStream与coGroupedStream
- 小米范工具系列之六:小米范 web查找器2.x版本发布
- Cookie , Session ,Session 劫持简单总结
- 善用GIMP(Linux下的Photoshop),图像处理轻松又自由
- Python 从基础------进阶------算法 系列
- android是32-bit系统还是64-bit系统
- codeforces679C Bear and Square Grid(dfs优化)
- Java Ping网站
- Lync 2013 的配置与使用
- Swift - 自定义函数规则说明
- 透过面试题,洞察Hbase 核心知识点
- Java性能优化指南系列(一):概述和性能测试方法
- Rxjava(2.操作符)
- _tmain()和main()的区别
- 算法杂货铺——分类算法之决策树(Decision tree)
- idea 清除svn登陆权限信息
- servlet多线程问题
- Java RandomAccessFile用法