关于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 ...
随机推荐
- 手机共享成wifi热点电脑无法上网的问题
第二次遇到这样的问题,每次百度都不能解决我遇到的问题.上一次已经自己鼓捣着解决了,后来忘记怎么弄好的.第二次遇到这个问题,又是浪费了许多时间后,偶然弄好了,突然想起来上次就是这样弄好的.所以就针对我自 ...
- Java Swing 图形界面实现验证码(验证码可动态刷新)
import java.awt.Color;import java.awt.Font;import java.awt.Graphics;import java.awt.Toolkit;import j ...
- VueJs开发笔记—IDE选择和WebStorm性能优化、框架特性和数据调用、路由选项以及使用
一.IDE的选择: VsCode和WebStorm都是不错的选择,两者运行调试都非常的方便都可以使用快捷键运行和停止,就打开项目的速度和对电脑配置的要求来说,vscode要比webstorm要出色很多 ...
- 纯真IP数据库格式详解
纯真版IP数据库,优点是记录多,查询速度快,它只用一个文件QQWry.dat就包含了所有记录,方便嵌入到其他程序中,也方便升级.缺点是你想要编辑它却是比较麻烦的,由于其文件格式的限制,你要直接添加IP ...
- CI集成phpunit Error: No code coverage driver is available 的解决
CI集成phpunit时,运行报No code coverage driver is available的错误,如下图: yanglingdeMacBook-Pro:tests yangling$ p ...
- 通过js给网页加上水印背景
有些后端管理系统,因为业务逻辑的需要,需要加上水印,下面就是水印方法. function watermark(settings) { debugger; //默认设置 var defaultSetti ...
- Html标签,file方式,上传文件
恩,如果不记下来,记忆就会模糊掉. 希望自己下次看见这篇博客的时候,会解决掉疑问 ----------------------------------------------------------- ...
- kafka的高可用和一致性探究
一.kafka基础 本篇文章讨论的kafka版本是目前最新版 0.10.1.0. 1.1 kafka种的KafkaController 所有broker会通过ZooKeeper选举出一个作为Kafka ...
- Micro 架构与设计
Micro 架构与设计 翻译自 Micro architecture & design patterns for microservices 注: 原文作者即 Micro 框架的开发者. 过去 ...
- TDE: Transparent Data Encryption brief introduction
1. What is TDE? Briefly speaking, TDE is used to encrypted data. 2. The benifits: Belows are come fr ...