ionic学习记录（三）

来源：互联网发布：burp 上传 php 编辑：程序博客网时间：2024/06/07 20:59

从现在开始进入了一种新的状态，对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标签中，同样适用：

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        })

0 0