zoukankan      html  css  js  c++  java
  • 关于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端也用不到)
  • 相关阅读:
    等宽布局和flex
    antd按需加载
    linux-redis cluster集群(redis5.x)
    linux-mysql-主从同步
    mysql-行转列
    Spring Bean 作用域
    ArrayList、LinkedList区别(jdk8)
    java类及实例初始化顺序
    线程池-结构
    GIT基础
  • 原文地址:https://www.cnblogs.com/u-lhy/p/6963573.html
Copyright © 2011-2022 走看看