关于Iscroll.js 的滑动和Angular.js路由冲突问题
Iscroll主要应用于app移动端开发。
主要代码:
window.onload=function(){
var myIscroll=new IScroll(".headerNav",{
scrollX:true
});
};
代码执行的效果图:

左右滑动导航,代码可以正常执行。
接下来 加入angular.route
<script type="text/javascript">
var app = angular.module("myCtrl", ['ngRoute']);
app.controller("test", function($scope) {});
app.config(function($routeProvider) {
$routeProvider.when('/a', {
templateUrl: "isTwo.html"
}).when('/b', {
templateUrl: "navOne.html"
}).when('/c', {
templateUrl: "navTwo.html"
}).otherwise({
redirectTo: "/a"
});
});
</script>
加入angular.route后,路由视图切换效果没有。但是Iscroll依然可以滑动,但是理想的效果没有实现。
解决的方法:
<script type="text/javascript">
var myIscroll = new IScroll(".headerNav", {
scrollX: true,
preventDefault:false
});
</script>
给iscroll对象加一个:
preventDefault:false
因为iscroll会阻止默认行为。把他的默认阻止干掉就可以了。
(pc端可以不用加,一般pc端也用不到)
关于Iscroll.js 的滑动和Angular.js路由冲突问题的更多相关文章
- Angular-chart.js 使用说明(基于angular.js工程)
Angular-chart.js是基于Chart.js的angular组件,引入项目后直接操作数据即可. 引用方法: 分别将Chart.js.angular-chart.js.angular-c ...
- jq,js简单实现类似Angular.js数据绑定效果
刚了解了下Angular.js,发现Angular.js绑定数据方面非常方便,套下教程demo: <div ng-app="myApp" ng-controller=&quo ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
- angular.js初探
2015年7月27日 22:26:35 星期一 用在我论坛里的小栗子: 先列出来一级回帖, 点击帖子前边的"查看回复"按钮无刷新的去请求该帖子的所有回复 首先要引用js文件, 我这 ...
- 推荐 15 个 Angular.js 应用扩展指令(参考应用)
几天前我们看到Angular 1.4.0发布了-一个以社团为驱动的发布版本涵盖了400多个GitHub的提交,增加了对特性的提升,比如动画,以及可用性. 官方新闻发布稿 覆盖了绝大部分,这同样值得放于 ...
- Angular.js中的$injector服务
一 .angular中的依赖注入 angular的一个很重要的特性就是依赖注入,可以分开理解这4个字. 1.依赖: angular里面的依赖,有angular默认提供的,也有我们自己添加的.默认提供的 ...
- {{angular.js 使用技巧}} - 实现计算列属性
前端MV*框架现在有很多,其中某些框架有计算列(又叫监控属性),比如:微软推荐的 Knockout.js 和博客园司徒正美的 avalon.js 框架. 本人只使用过 Knockout.js,aval ...
- angular.js之作用域scope'@','=','&'
<!doctype html> <html ng-app='myApp'> <head> </head> <body> <script ...
- Angular.js之服务与自定义服务学习笔记
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- realmock 前后端分离方案
realmock 前后端分离方案 express + randomjson 模拟后端服务,前端服务器(比如webpack, nigix等)将请求代理到该服务器地址即可 github地址:https:/ ...
- GitHub 常用命令使用介绍(新同学入门)
经济在不断发展,社会在不断进步,以往的互联网在现在看来都可以称为传统互联网了,因为技术不断的在突破和革新. 本文主要介绍一下版本管理工具,我猜测很多人还是用SVN.CVS或者Resion,但是,今天我 ...
- 由于losf引起的pxc启动报错处理
PXC主节点启动完成后,再启动node1,error日志报错: 2017-05-02T15:23:42.830888Z 0 [ERROR] WSREP: Failed to read 'ready & ...
- html页面顶部出现一段空白,检查控制台发现body 下出现字符,原因及解决办法
html页面顶部出现一段空白,检查控制台发现body 下出现字符,原因及解决办法 分析: 原来是页面编码时增加了BOM,此页面后端数据主要是PHP语言,对PHP来讲PHP在设计时 ...
- 也许是目前实现最好的js模拟滚动插件
finger-mover 是一个集成 Fingerd(移动端以手指为单位的事件管理方案) 和 Moved(微型运动方案) 为一体的移动端动效平台,finger-mover 本身并不能为你做什么,但是附 ...
- 多参数请求 C# webApi
今天在写项目然后发现了一个 webapi 的一个小功能 可能有些人 不知道 所以顺手分享一下 希望大牛不要喷... webapi 创建的时候 的 get 请求 默认模板是俩个 一个不带参数的Get ...
- Maven学习(四)
eclipse创建Maven web项目 1.创建新项目 选择File -> New ->Project 选择New Project窗口中选择 Maven -> Maven Proj ...
- 全局精确流量调度新思路-HttpDNS服务详解
但凡使用域名来给用户提供服务的互联网企业,都或多或少地无法避免在有中国特色的互联网环境中遭遇到各种域名被缓存.用户跨网访问缓慢等问题.那么对于腾讯这样的域名数量在10万级别的互联网公司来讲,域名解析异 ...
- itmacy_我的博客
开通博客的第一天,并不希望自己以后像写流水账一样来写自己的博客,而是希望每一篇博客,无论是转载还是原创,都是经过深思熟虑,并且有意义的...
- 2017-5-29 Excel VBA 小游戏
---恢复内容开始--- 转一个Excel VBA的小游戏,最近对excel有了更深入的了解,功能很强大,也刷新了我对待事情的态度. 一.准备界面 我们先来把游戏界面准备好,选中前4行,行高调成50, ...