Ionic--开发中碰到的一些问题

Ionic 2016-07-13 欢迎您加入IT交流群:123493055IT交流群

写篇文章来整理我在Ionic开发中碰到的一些问题,以便查阅

Ionic 调用键盘搜索

<form action="#">
  <input type="search" placeholder="输入关键字" 
	   ng-model="search.key" ng-focus="searchInput()" 
	   ng-enter="doSearch(search.key)">
</form>
.directive('ngEnter', function() {
  return function(scope, element, attrs) {
    element.bind("keydown keypress", function(event) {
      if(event.which === 13) {
        scope.$apply(function(){
          scope.$eval(attrs.ngEnter);
		});
		event.preventDefault();
	  }
	});
  };
});


angularjs中ui-sref传递参数

<div class="col" ui-sref="app.home-search({flag:'course'})"></div>
<div class="col" ui-sref="app.home-search({type: 1, role: 2})"></div>


angularjs中$http模块POST请求request payload转form data

对接后台接口,用post不成功,后台人员截图过来又说他那边可以,对比过后发现angular post请求表单参数在Request payload 他的在Form data,搜了解决方法有两种

解决1配置$httpProvider:

var myApp = angular.module('app',[]);  
myApp.config(function($httpProvider){  

  $httpProvider.defaults.transformRequest = function(obj){  
    var str = [];  
    for(var p in obj){
      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));  
    }  
    return str.join("&");  
  }  

  $httpProvider.defaults.headers.post = {
    'Content-Type': 'application/x-www-form-urlencoded'  
  }  

});

解决2在post中配置:

var url = ApiService.getEndpoint() + "api/feedback/appSave.do";
return $http({
  url: url,
  method: 'POST',
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
  },
  transformRequest: function(obj) {
    var str = [];
    for (var p in obj) {
      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
	}
	return str.join("&");
  },
  data: data
});

ps:如果加载了jquery可以直接这样使用

transformRequest : function(data){
  return $.param(data);
}


ionic访问外网

详情请移步Ionic InAppBrowser app内访问外网

我的实现


滑动到屏幕顶端不是内容顶端

var scroll = document.getElementById(id).offsetTop - $ionicScrollDelegate.getScrollPosition().top;
$ionicScrollDelegate.resize();
$ionicScrollDelegate.scrollBy(0, scroll, true);


Ionic清除某一页面的cache

$ionicHistory.clearCache(["tab.aa","tab.bb"]).then(function() {
  $state.go('tab.home');
});


angular video ng-src 不起作用

app.filter('trusted', ['$sce', function ($sce) {
  return function(url) {
    return $sce.trustAsResourceUrl(url);
  };
}]);
<video controls poster="img/poster.png">
  <source ng-src="" type="video/mp4"/>
</video>


Ionic angular切换语言 国际化问题

移步至:Ionic angular国际化问题


config.xml设置KeyboardDisplayRequiresUserAction为true,实现评论键盘自动弹出的功能(没试过)

<preference name="KeyboardDisplayRequiresUserAction" value="false" />


网络情况$cordovaNetwork

$rootScope.$on('$ionicView.afterEnter', function(scopes, states) {
  if (window.cordova) {
    var type = $cordovaNetwork.getNetwork();

    if (type == '2g' || type == 'none'|| type == 'unknown') {
      $cordovaToast.showLongCenter('当前网络慢,请在网络顺畅情况下使用');
    }
  }
});

注:凡原创文章转载请注明出处(有好的建议和意见可以联系我(*^__^*))